@spectrum-web-components/overlay 0.36.0 → 0.37.0
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/README.md +266 -149
- package/custom-elements.json +1678 -553
- package/package.json +49 -22
- package/sp-overlay.d.ts +6 -0
- package/sp-overlay.dev.js +5 -0
- package/{active-overlay.dev.js.map → sp-overlay.dev.js.map} +3 -3
- package/sp-overlay.js +2 -0
- package/{active-overlay.js.map → sp-overlay.js.map} +4 -4
- package/src/AbstractOverlay.d.ts +58 -0
- package/src/AbstractOverlay.dev.js +211 -0
- package/src/AbstractOverlay.dev.js.map +7 -0
- package/src/AbstractOverlay.js +2 -0
- package/src/AbstractOverlay.js.map +7 -0
- package/src/Overlay.d.ts +163 -0
- package/src/Overlay.dev.js +792 -0
- package/src/Overlay.dev.js.map +7 -0
- package/src/Overlay.js +33 -0
- package/src/Overlay.js.map +7 -0
- package/src/OverlayDialog.d.ts +4 -0
- package/src/OverlayDialog.dev.js +135 -0
- package/src/OverlayDialog.dev.js.map +7 -0
- package/src/OverlayDialog.js +2 -0
- package/src/OverlayDialog.js.map +7 -0
- package/src/OverlayNoPopover.d.ts +4 -0
- package/src/OverlayNoPopover.dev.js +109 -0
- package/src/OverlayNoPopover.dev.js.map +7 -0
- package/src/OverlayNoPopover.js +2 -0
- package/src/OverlayNoPopover.js.map +7 -0
- package/src/OverlayPopover.d.ts +4 -0
- package/src/OverlayPopover.dev.js +169 -0
- package/src/OverlayPopover.dev.js.map +7 -0
- package/src/OverlayPopover.js +2 -0
- package/src/OverlayPopover.js.map +7 -0
- package/src/OverlayStack.d.ts +43 -0
- package/src/OverlayStack.dev.js +150 -0
- package/src/OverlayStack.dev.js.map +7 -0
- package/src/OverlayStack.js +2 -0
- package/src/OverlayStack.js.map +7 -0
- package/src/OverlayTrigger.d.ts +26 -42
- package/src/OverlayTrigger.dev.js +172 -296
- package/src/OverlayTrigger.dev.js.map +3 -3
- package/src/OverlayTrigger.js +49 -25
- package/src/OverlayTrigger.js.map +3 -3
- package/src/PlacementController.d.ts +38 -0
- package/src/PlacementController.dev.js +199 -0
- package/src/PlacementController.dev.js.map +7 -0
- package/src/PlacementController.js +2 -0
- package/src/PlacementController.js.map +7 -0
- package/src/VirtualTrigger.dev.js +2 -1
- package/src/VirtualTrigger.dev.js.map +2 -2
- package/src/VirtualTrigger.js +1 -1
- package/src/VirtualTrigger.js.map +2 -2
- package/src/fullSizePlugin.d.ts +12 -0
- package/src/fullSizePlugin.dev.js +39 -0
- package/src/fullSizePlugin.dev.js.map +7 -0
- package/src/fullSizePlugin.js +2 -0
- package/src/fullSizePlugin.js.map +7 -0
- package/src/index.d.ts +2 -3
- package/src/index.dev.js +2 -3
- package/src/index.dev.js.map +2 -2
- package/src/index.js +1 -1
- package/src/index.js.map +2 -2
- package/src/loader.d.ts +1 -2
- package/src/loader.dev.js +2 -19
- package/src/loader.dev.js.map +2 -2
- package/src/loader.js +1 -1
- package/src/loader.js.map +3 -3
- package/src/overlay-timer.dev.js.map +2 -2
- package/src/overlay-timer.js.map +2 -2
- package/src/overlay-trigger.css.dev.js +1 -1
- package/src/overlay-trigger.css.dev.js.map +1 -1
- package/src/overlay-trigger.css.js +3 -3
- package/src/overlay-trigger.css.js.map +1 -1
- package/src/overlay-types.d.ts +25 -31
- package/src/overlay-types.dev.js +1 -0
- package/src/overlay-types.dev.js.map +3 -3
- package/src/overlay-types.js +1 -1
- package/src/overlay-types.js.map +3 -3
- package/src/overlay.css.dev.js +9 -0
- package/src/overlay.css.dev.js.map +7 -0
- package/src/overlay.css.js +6 -0
- package/src/overlay.css.js.map +7 -0
- package/src/topLayerOverTransforms.d.ts +2 -0
- package/src/topLayerOverTransforms.dev.js +91 -0
- package/src/topLayerOverTransforms.dev.js.map +7 -0
- package/src/topLayerOverTransforms.js +2 -0
- package/src/topLayerOverTransforms.js.map +7 -0
- package/stories/overlay-element.stories.js +476 -0
- package/stories/overlay-element.stories.js.map +7 -0
- package/stories/overlay-story-components.js +9 -8
- package/stories/overlay-story-components.js.map +2 -2
- package/stories/overlay.stories.js +824 -680
- package/stories/overlay.stories.js.map +2 -2
- package/sync/overlay-trigger.d.ts +5 -0
- package/sync/overlay-trigger.dev.js +2 -4
- package/sync/overlay-trigger.dev.js.map +2 -2
- package/sync/overlay-trigger.js +1 -1
- package/sync/overlay-trigger.js.map +3 -3
- package/test/benchmark/basic-test.js +2 -2
- package/test/benchmark/basic-test.js.map +1 -1
- package/test/index.js +414 -377
- package/test/index.js.map +3 -3
- package/test/overlay-element.test-vrt.js +5 -0
- package/test/overlay-element.test-vrt.js.map +7 -0
- package/test/overlay-element.test.js +682 -0
- package/test/overlay-element.test.js.map +7 -0
- package/test/overlay-lifecycle.test.js +36 -106
- package/test/overlay-lifecycle.test.js.map +2 -2
- package/test/overlay-trigger-click.test.js +11 -5
- package/test/overlay-trigger-click.test.js.map +2 -2
- package/test/overlay-trigger-extended.test.js +46 -36
- package/test/overlay-trigger-extended.test.js.map +2 -2
- package/test/overlay-trigger-hover-click.test.js +38 -25
- package/test/overlay-trigger-hover-click.test.js.map +2 -2
- package/test/overlay-trigger-hover.test.js +41 -35
- package/test/overlay-trigger-hover.test.js.map +2 -2
- package/test/overlay-trigger-longpress.test.js +211 -82
- package/test/overlay-trigger-longpress.test.js.map +2 -2
- package/test/overlay-trigger-sync.test.js +1 -1
- package/test/overlay-trigger-sync.test.js.map +2 -2
- package/test/overlay-trigger.test.js +1 -1
- package/test/overlay-trigger.test.js.map +2 -2
- package/test/overlay-update.test.js +5 -5
- package/test/overlay-update.test.js.map +2 -2
- package/test/overlay-v1.test.js +547 -0
- package/test/overlay-v1.test.js.map +7 -0
- package/test/overlay.test.js +385 -269
- package/test/overlay.test.js.map +3 -3
- package/active-overlay.d.ts +0 -6
- package/active-overlay.dev.js +0 -5
- package/active-overlay.js +0 -2
- package/src/ActiveOverlay.d.ts +0 -84
- package/src/ActiveOverlay.dev.js +0 -517
- package/src/ActiveOverlay.dev.js.map +0 -7
- package/src/ActiveOverlay.js +0 -16
- package/src/ActiveOverlay.js.map +0 -7
- package/src/active-overlay.css.dev.js +0 -13
- package/src/active-overlay.css.dev.js.map +0 -7
- package/src/active-overlay.css.js +0 -10
- package/src/active-overlay.css.js.map +0 -7
- package/src/overlay-stack.d.ts +0 -50
- package/src/overlay-stack.dev.js +0 -515
- package/src/overlay-stack.dev.js.map +0 -7
- package/src/overlay-stack.js +0 -34
- package/src/overlay-stack.js.map +0 -7
- package/src/overlay-utils.d.ts +0 -3
- package/src/overlay-utils.dev.js +0 -31
- package/src/overlay-utils.dev.js.map +0 -7
- package/src/overlay-utils.js +0 -2
- package/src/overlay-utils.js.map +0 -7
- package/src/overlay.d.ts +0 -59
- package/src/overlay.dev.js +0 -127
- package/src/overlay.dev.js.map +0 -7
- package/src/overlay.js +0 -2
- package/src/overlay.js.map +0 -7
- /package/src/{active-overlay.css.d.ts → overlay.css.d.ts} +0 -0
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@spectrum-web-components/overlay",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.37.0",
|
|
4
4
|
"publishConfig": {
|
|
5
5
|
"access": "public"
|
|
6
6
|
},
|
|
@@ -25,19 +25,46 @@
|
|
|
25
25
|
"default": "./src/index.js"
|
|
26
26
|
},
|
|
27
27
|
"./package.json": "./package.json",
|
|
28
|
-
"./src/
|
|
29
|
-
"development": "./src/
|
|
30
|
-
"default": "./src/
|
|
28
|
+
"./src/AbstractOverlay.js": {
|
|
29
|
+
"development": "./src/AbstractOverlay.dev.js",
|
|
30
|
+
"default": "./src/AbstractOverlay.js"
|
|
31
|
+
},
|
|
32
|
+
"./src/Overlay.js": {
|
|
33
|
+
"development": "./src/Overlay.dev.js",
|
|
34
|
+
"default": "./src/Overlay.js"
|
|
35
|
+
},
|
|
36
|
+
"./src/OverlayDialog.js": {
|
|
37
|
+
"development": "./src/OverlayDialog.dev.js",
|
|
38
|
+
"default": "./src/OverlayDialog.js"
|
|
39
|
+
},
|
|
40
|
+
"./src/OverlayNoPopover.js": {
|
|
41
|
+
"development": "./src/OverlayNoPopover.dev.js",
|
|
42
|
+
"default": "./src/OverlayNoPopover.js"
|
|
43
|
+
},
|
|
44
|
+
"./src/OverlayPopover.js": {
|
|
45
|
+
"development": "./src/OverlayPopover.dev.js",
|
|
46
|
+
"default": "./src/OverlayPopover.js"
|
|
47
|
+
},
|
|
48
|
+
"./src/OverlayStack.js": {
|
|
49
|
+
"development": "./src/OverlayStack.dev.js",
|
|
50
|
+
"default": "./src/OverlayStack.js"
|
|
31
51
|
},
|
|
32
52
|
"./src/OverlayTrigger.js": {
|
|
33
53
|
"development": "./src/OverlayTrigger.dev.js",
|
|
34
54
|
"default": "./src/OverlayTrigger.js"
|
|
35
55
|
},
|
|
56
|
+
"./src/PlacementController.js": {
|
|
57
|
+
"development": "./src/PlacementController.dev.js",
|
|
58
|
+
"default": "./src/PlacementController.js"
|
|
59
|
+
},
|
|
36
60
|
"./src/VirtualTrigger.js": {
|
|
37
61
|
"development": "./src/VirtualTrigger.dev.js",
|
|
38
62
|
"default": "./src/VirtualTrigger.js"
|
|
39
63
|
},
|
|
40
|
-
"./src/
|
|
64
|
+
"./src/fullSizePlugin.js": {
|
|
65
|
+
"development": "./src/fullSizePlugin.dev.js",
|
|
66
|
+
"default": "./src/fullSizePlugin.js"
|
|
67
|
+
},
|
|
41
68
|
"./src/index.js": {
|
|
42
69
|
"development": "./src/index.dev.js",
|
|
43
70
|
"default": "./src/index.js"
|
|
@@ -50,10 +77,6 @@
|
|
|
50
77
|
"development": "./src/overlay-events.dev.js",
|
|
51
78
|
"default": "./src/overlay-events.js"
|
|
52
79
|
},
|
|
53
|
-
"./src/overlay-stack.js": {
|
|
54
|
-
"development": "./src/overlay-stack.dev.js",
|
|
55
|
-
"default": "./src/overlay-stack.js"
|
|
56
|
-
},
|
|
57
80
|
"./src/overlay-timer.js": {
|
|
58
81
|
"development": "./src/overlay-timer.dev.js",
|
|
59
82
|
"default": "./src/overlay-timer.js"
|
|
@@ -63,13 +86,10 @@
|
|
|
63
86
|
"development": "./src/overlay-types.dev.js",
|
|
64
87
|
"default": "./src/overlay-types.js"
|
|
65
88
|
},
|
|
66
|
-
"./src/overlay
|
|
67
|
-
|
|
68
|
-
"
|
|
69
|
-
|
|
70
|
-
"./src/overlay.js": {
|
|
71
|
-
"development": "./src/overlay.dev.js",
|
|
72
|
-
"default": "./src/overlay.js"
|
|
89
|
+
"./src/overlay.css.js": "./src/overlay.css.js",
|
|
90
|
+
"./src/topLayerOverTransforms.js": {
|
|
91
|
+
"development": "./src/topLayerOverTransforms.dev.js",
|
|
92
|
+
"default": "./src/topLayerOverTransforms.js"
|
|
73
93
|
},
|
|
74
94
|
"./active-overlay.js": {
|
|
75
95
|
"development": "./active-overlay.dev.js",
|
|
@@ -82,6 +102,10 @@
|
|
|
82
102
|
"./sync/overlay-trigger.js": {
|
|
83
103
|
"development": "./sync/overlay-trigger.dev.js",
|
|
84
104
|
"default": "./sync/overlay-trigger.js"
|
|
105
|
+
},
|
|
106
|
+
"./sp-overlay.js": {
|
|
107
|
+
"development": "./sp-overlay.dev.js",
|
|
108
|
+
"default": "./sp-overlay.js"
|
|
85
109
|
}
|
|
86
110
|
},
|
|
87
111
|
"scripts": {
|
|
@@ -102,20 +126,23 @@
|
|
|
102
126
|
"lit-html"
|
|
103
127
|
],
|
|
104
128
|
"dependencies": {
|
|
105
|
-
"@floating-ui/dom": "^1.
|
|
106
|
-
"@
|
|
107
|
-
"@spectrum-web-components/
|
|
108
|
-
"@spectrum-web-components/
|
|
109
|
-
"@spectrum-web-components/
|
|
129
|
+
"@floating-ui/dom": "^1.5.1",
|
|
130
|
+
"@floating-ui/utils": "^0.1.1",
|
|
131
|
+
"@spectrum-web-components/action-button": "^0.37.0",
|
|
132
|
+
"@spectrum-web-components/base": "^0.37.0",
|
|
133
|
+
"@spectrum-web-components/reactive-controllers": "^0.37.0",
|
|
134
|
+
"@spectrum-web-components/shared": "^0.37.0",
|
|
135
|
+
"@spectrum-web-components/theme": "^0.37.0"
|
|
110
136
|
},
|
|
111
137
|
"types": "./src/index.d.ts",
|
|
112
138
|
"customElements": "custom-elements.json",
|
|
113
139
|
"sideEffects": [
|
|
114
140
|
"./active-overlay.js",
|
|
115
141
|
"./overlay-trigger.js",
|
|
142
|
+
"./sp-overlay.js",
|
|
116
143
|
"./sync/overlay-trigger.js",
|
|
117
144
|
"./stories/overlay-story-components.js",
|
|
118
145
|
"./**/*.dev.js"
|
|
119
146
|
],
|
|
120
|
-
"gitHead": "
|
|
147
|
+
"gitHead": "d771f62f0d8063070af43283bb0fd5e3400bad06"
|
|
121
148
|
}
|
package/sp-overlay.d.ts
ADDED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": ["
|
|
4
|
-
"sourcesContent": ["/*\nCopyright
|
|
5
|
-
"mappings": ";AAWA,SAAS,qBAAqB;AAC9B,SAAS,
|
|
3
|
+
"sources": ["sp-overlay.ts"],
|
|
4
|
+
"sourcesContent": ["/*\nCopyright 2023 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nimport { defineElement } from '@spectrum-web-components/base/src/define-element.js';\nimport { Overlay } from './src/Overlay.dev.js'\n\ndefineElement('sp-overlay', Overlay);\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'sp-overlay': Overlay;\n }\n}\n"],
|
|
5
|
+
"mappings": ";AAWA,SAAS,qBAAqB;AAC9B,SAAS,eAAe;AAExB,cAAc,cAAc,OAAO;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/sp-overlay.js
ADDED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": ["
|
|
4
|
-
"sourcesContent": ["/*\nCopyright
|
|
5
|
-
"mappings": "aAWA,OAAS,iBAAAA,MAAqB,sDAC9B,OAAS,
|
|
6
|
-
"names": ["defineElement", "
|
|
3
|
+
"sources": ["sp-overlay.ts"],
|
|
4
|
+
"sourcesContent": ["/*\nCopyright 2023 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nimport { defineElement } from '@spectrum-web-components/base/src/define-element.js';\nimport { Overlay } from './src/Overlay.js';\n\ndefineElement('sp-overlay', Overlay);\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'sp-overlay': Overlay;\n }\n}\n"],
|
|
5
|
+
"mappings": "aAWA,OAAS,iBAAAA,MAAqB,sDAC9B,OAAS,WAAAC,MAAe,mBAExBD,EAAc,aAAcC,CAAO",
|
|
6
|
+
"names": ["defineElement", "Overlay"]
|
|
7
7
|
}
|
|
@@ -0,0 +1,58 @@
|
|
|
1
|
+
import { SpectrumElement } from '@spectrum-web-components/base';
|
|
2
|
+
import type { OpenableElement, OverlayOptions, OverlayOptionsV1, OverlayState, OverlayTypes, TriggerInteractionsV1 } from './overlay-types.js';
|
|
3
|
+
import { Overlay } from './Overlay.js';
|
|
4
|
+
import type { VirtualTrigger } from './VirtualTrigger.js';
|
|
5
|
+
import { OverlayTimer } from './overlay-timer.js';
|
|
6
|
+
import { PlacementController } from './PlacementController.js';
|
|
7
|
+
export declare const overlayTimer: OverlayTimer;
|
|
8
|
+
export declare const noop: () => void;
|
|
9
|
+
export declare class BeforetoggleClosedEvent extends Event {
|
|
10
|
+
currentState: string;
|
|
11
|
+
newState: string;
|
|
12
|
+
constructor();
|
|
13
|
+
}
|
|
14
|
+
export declare class BeforetoggleOpenEvent extends Event {
|
|
15
|
+
currentState: string;
|
|
16
|
+
newState: string;
|
|
17
|
+
constructor();
|
|
18
|
+
}
|
|
19
|
+
/**
|
|
20
|
+
* Apply a "transitionend" listener to an element that may not transition but
|
|
21
|
+
* guarantee the callback will be fired either way.
|
|
22
|
+
*
|
|
23
|
+
* @param el {HTMLElement} - Target of the "transition" listeners.
|
|
24
|
+
* @param action {Function} - Method to trigger the "transition".
|
|
25
|
+
* @param cb {Function} - Callback to trigger when the "transition" has ended.
|
|
26
|
+
*/
|
|
27
|
+
export declare const guaranteedAllTransitionend: (el: HTMLElement, action: () => void, cb: () => void) => void;
|
|
28
|
+
export declare function nextFrame(): Promise<void>;
|
|
29
|
+
export declare function forcePaint(): void;
|
|
30
|
+
export declare class AbstractOverlay extends SpectrumElement {
|
|
31
|
+
protected applyFocus(_targetOpenState: boolean, _focusEl: HTMLElement | null): Promise<void>;
|
|
32
|
+
delayed: boolean;
|
|
33
|
+
dialogEl: HTMLDialogElement & {
|
|
34
|
+
showPopover(): void;
|
|
35
|
+
hidePopover(): void;
|
|
36
|
+
};
|
|
37
|
+
dispose: () => void;
|
|
38
|
+
protected ensureOnDOM(_targetOpenState: boolean): Promise<void>;
|
|
39
|
+
elements: OpenableElement[];
|
|
40
|
+
protected makeTransition(_targetOpenState: boolean): Promise<HTMLElement | null>;
|
|
41
|
+
protected manageDelay(_targetOpenState: boolean): Promise<void>;
|
|
42
|
+
protected manageDialogOpen(): Promise<void>;
|
|
43
|
+
protected managePopoverOpen(): Promise<void>;
|
|
44
|
+
protected managePosition(): void;
|
|
45
|
+
get open(): boolean;
|
|
46
|
+
set open(_open: boolean);
|
|
47
|
+
protected placementController: PlacementController;
|
|
48
|
+
receivesFocus: 'true' | 'false' | 'auto';
|
|
49
|
+
get state(): OverlayState;
|
|
50
|
+
set state(_state: OverlayState);
|
|
51
|
+
protected _state: OverlayState;
|
|
52
|
+
triggerElement: HTMLElement | VirtualTrigger | null;
|
|
53
|
+
type: OverlayTypes;
|
|
54
|
+
manuallyKeepOpen(): void;
|
|
55
|
+
static update(): void;
|
|
56
|
+
static open(trigger: HTMLElement, interaction: TriggerInteractionsV1, content: HTMLElement, optionsV1: OverlayOptionsV1): Promise<() => void>;
|
|
57
|
+
static open(content: HTMLElement, options?: OverlayOptions): Promise<Overlay>;
|
|
58
|
+
}
|
|
@@ -0,0 +1,211 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
import { SpectrumElement } from "@spectrum-web-components/base";
|
|
3
|
+
import { reparentChildren } from "@spectrum-web-components/shared/src/reparent-children.js";
|
|
4
|
+
import { Overlay } from "./Overlay.dev.js";
|
|
5
|
+
import { OverlayTimer } from "./overlay-timer.dev.js";
|
|
6
|
+
export const overlayTimer = new OverlayTimer();
|
|
7
|
+
export const noop = () => {
|
|
8
|
+
return;
|
|
9
|
+
};
|
|
10
|
+
export class BeforetoggleClosedEvent extends Event {
|
|
11
|
+
constructor() {
|
|
12
|
+
super("beforetoggle", {
|
|
13
|
+
bubbles: false,
|
|
14
|
+
composed: false
|
|
15
|
+
});
|
|
16
|
+
this.currentState = "open";
|
|
17
|
+
this.newState = "closed";
|
|
18
|
+
}
|
|
19
|
+
}
|
|
20
|
+
export class BeforetoggleOpenEvent extends Event {
|
|
21
|
+
constructor() {
|
|
22
|
+
super("beforetoggle", {
|
|
23
|
+
bubbles: false,
|
|
24
|
+
composed: false
|
|
25
|
+
});
|
|
26
|
+
this.currentState = "closed";
|
|
27
|
+
this.newState = "open";
|
|
28
|
+
}
|
|
29
|
+
}
|
|
30
|
+
export const guaranteedAllTransitionend = (el, action, cb) => {
|
|
31
|
+
const abortController = new AbortController();
|
|
32
|
+
const runningTransitions = /* @__PURE__ */ new Map();
|
|
33
|
+
const cleanup = () => {
|
|
34
|
+
abortController.abort();
|
|
35
|
+
cb();
|
|
36
|
+
};
|
|
37
|
+
let guarantee2;
|
|
38
|
+
let guarantee3;
|
|
39
|
+
const guarantee1 = requestAnimationFrame(() => {
|
|
40
|
+
guarantee2 = requestAnimationFrame(() => {
|
|
41
|
+
guarantee3 = requestAnimationFrame(() => {
|
|
42
|
+
cleanup();
|
|
43
|
+
});
|
|
44
|
+
});
|
|
45
|
+
});
|
|
46
|
+
const handleTransitionend = (event) => {
|
|
47
|
+
if (event.target !== el) {
|
|
48
|
+
return;
|
|
49
|
+
}
|
|
50
|
+
runningTransitions.set(
|
|
51
|
+
event.propertyName,
|
|
52
|
+
runningTransitions.get(event.propertyName) - 1
|
|
53
|
+
);
|
|
54
|
+
if (!runningTransitions.get(event.propertyName)) {
|
|
55
|
+
runningTransitions.delete(event.propertyName);
|
|
56
|
+
}
|
|
57
|
+
if (runningTransitions.size === 0) {
|
|
58
|
+
cleanup();
|
|
59
|
+
}
|
|
60
|
+
};
|
|
61
|
+
const handleTransitionrun = (event) => {
|
|
62
|
+
if (event.target !== el) {
|
|
63
|
+
return;
|
|
64
|
+
}
|
|
65
|
+
if (!runningTransitions.has(event.propertyName)) {
|
|
66
|
+
runningTransitions.set(event.propertyName, 0);
|
|
67
|
+
}
|
|
68
|
+
runningTransitions.set(
|
|
69
|
+
event.propertyName,
|
|
70
|
+
runningTransitions.get(event.propertyName) + 1
|
|
71
|
+
);
|
|
72
|
+
cancelAnimationFrame(guarantee1);
|
|
73
|
+
cancelAnimationFrame(guarantee2);
|
|
74
|
+
cancelAnimationFrame(guarantee3);
|
|
75
|
+
};
|
|
76
|
+
el.addEventListener("transitionrun", handleTransitionrun, {
|
|
77
|
+
signal: abortController.signal
|
|
78
|
+
});
|
|
79
|
+
el.addEventListener("transitionend", handleTransitionend, {
|
|
80
|
+
signal: abortController.signal
|
|
81
|
+
});
|
|
82
|
+
el.addEventListener("transitioncancel", handleTransitionend, {
|
|
83
|
+
signal: abortController.signal
|
|
84
|
+
});
|
|
85
|
+
action();
|
|
86
|
+
};
|
|
87
|
+
export function nextFrame() {
|
|
88
|
+
return new Promise((res) => requestAnimationFrame(() => res()));
|
|
89
|
+
}
|
|
90
|
+
export function forcePaint() {
|
|
91
|
+
document.body.offsetHeight;
|
|
92
|
+
}
|
|
93
|
+
export class AbstractOverlay extends SpectrumElement {
|
|
94
|
+
constructor() {
|
|
95
|
+
super(...arguments);
|
|
96
|
+
this.dispose = noop;
|
|
97
|
+
}
|
|
98
|
+
async applyFocus(_targetOpenState, _focusEl) {
|
|
99
|
+
return;
|
|
100
|
+
}
|
|
101
|
+
async ensureOnDOM(_targetOpenState) {
|
|
102
|
+
return;
|
|
103
|
+
}
|
|
104
|
+
async makeTransition(_targetOpenState) {
|
|
105
|
+
return null;
|
|
106
|
+
}
|
|
107
|
+
async manageDelay(_targetOpenState) {
|
|
108
|
+
return;
|
|
109
|
+
}
|
|
110
|
+
async manageDialogOpen() {
|
|
111
|
+
return;
|
|
112
|
+
}
|
|
113
|
+
async managePopoverOpen() {
|
|
114
|
+
return;
|
|
115
|
+
}
|
|
116
|
+
managePosition() {
|
|
117
|
+
return;
|
|
118
|
+
}
|
|
119
|
+
get open() {
|
|
120
|
+
return false;
|
|
121
|
+
}
|
|
122
|
+
set open(_open) {
|
|
123
|
+
return;
|
|
124
|
+
}
|
|
125
|
+
get state() {
|
|
126
|
+
return "closed";
|
|
127
|
+
}
|
|
128
|
+
set state(_state) {
|
|
129
|
+
return;
|
|
130
|
+
}
|
|
131
|
+
manuallyKeepOpen() {
|
|
132
|
+
return;
|
|
133
|
+
}
|
|
134
|
+
static update() {
|
|
135
|
+
const overlayUpdateEvent = new CustomEvent("sp-update-overlays", {
|
|
136
|
+
bubbles: true,
|
|
137
|
+
composed: true,
|
|
138
|
+
cancelable: true
|
|
139
|
+
});
|
|
140
|
+
document.dispatchEvent(overlayUpdateEvent);
|
|
141
|
+
}
|
|
142
|
+
static async open(triggerOrContent, interactionOrOptions, content, optionsV1) {
|
|
143
|
+
var _a, _b, _c, _d;
|
|
144
|
+
const v2 = arguments.length === 2;
|
|
145
|
+
const overlayContent = content || triggerOrContent;
|
|
146
|
+
const overlay = new Overlay();
|
|
147
|
+
let restored = false;
|
|
148
|
+
overlay.dispose = () => {
|
|
149
|
+
overlay.addEventListener("sp-closed", () => {
|
|
150
|
+
if (!restored) {
|
|
151
|
+
restoreContent();
|
|
152
|
+
restored = true;
|
|
153
|
+
}
|
|
154
|
+
requestAnimationFrame(() => {
|
|
155
|
+
overlay.remove();
|
|
156
|
+
});
|
|
157
|
+
});
|
|
158
|
+
overlay.open = false;
|
|
159
|
+
overlay.dispose = noop;
|
|
160
|
+
};
|
|
161
|
+
const restoreContent = reparentChildren([overlayContent], overlay, {
|
|
162
|
+
position: "beforeend",
|
|
163
|
+
prepareCallback: (el) => {
|
|
164
|
+
const slot = el.slot;
|
|
165
|
+
el.removeAttribute("slot");
|
|
166
|
+
return () => {
|
|
167
|
+
el.slot = slot;
|
|
168
|
+
};
|
|
169
|
+
}
|
|
170
|
+
});
|
|
171
|
+
const v1 = !v2 && overlayContent && optionsV1;
|
|
172
|
+
if (v1) {
|
|
173
|
+
if (true) {
|
|
174
|
+
window.__swc.warn(
|
|
175
|
+
overlay,
|
|
176
|
+
`You are interacting with an ${overlay.localName} element via a deprecated imperative API. This API will be removed in a future version of the SWC library. Consider leveraging an ${overlay.localName} directly.`,
|
|
177
|
+
"https://opensource.adobe.com/spectrum-web-components/components/overlay/",
|
|
178
|
+
{ level: "deprecation" }
|
|
179
|
+
);
|
|
180
|
+
}
|
|
181
|
+
const trigger = triggerOrContent;
|
|
182
|
+
const interaction = interactionOrOptions;
|
|
183
|
+
const options2 = optionsV1;
|
|
184
|
+
overlay.delayed = options2.delayed || overlayContent.hasAttribute("delayed");
|
|
185
|
+
overlay.receivesFocus = (_a = options2.receivesFocus) != null ? _a : "auto";
|
|
186
|
+
overlay.triggerElement = options2.virtualTrigger || trigger;
|
|
187
|
+
overlay.type = interaction === "modal" ? "modal" : interaction === "hover" ? "hint" : "auto";
|
|
188
|
+
overlay.offset = (_b = options2.offset) != null ? _b : 6;
|
|
189
|
+
overlay.placement = options2.placement;
|
|
190
|
+
overlay.willPreventClose = !!options2.notImmediatelyClosable;
|
|
191
|
+
trigger.insertAdjacentElement("afterend", overlay);
|
|
192
|
+
await overlay.updateComplete;
|
|
193
|
+
overlay.open = true;
|
|
194
|
+
return overlay.dispose;
|
|
195
|
+
}
|
|
196
|
+
const options = interactionOrOptions;
|
|
197
|
+
overlay.append(overlayContent);
|
|
198
|
+
overlay.delayed = options.delayed || overlayContent.hasAttribute("delayed");
|
|
199
|
+
overlay.receivesFocus = (_c = options.receivesFocus) != null ? _c : "auto";
|
|
200
|
+
overlay.triggerElement = options.trigger || null;
|
|
201
|
+
overlay.type = options.type || "modal";
|
|
202
|
+
overlay.offset = (_d = options.offset) != null ? _d : 6;
|
|
203
|
+
overlay.placement = options.placement;
|
|
204
|
+
overlay.willPreventClose = !!options.notImmediatelyClosable;
|
|
205
|
+
overlay.updateComplete.then(() => {
|
|
206
|
+
overlay.open = true;
|
|
207
|
+
});
|
|
208
|
+
return overlay;
|
|
209
|
+
}
|
|
210
|
+
}
|
|
211
|
+
//# sourceMappingURL=AbstractOverlay.dev.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["AbstractOverlay.ts"],
|
|
4
|
+
"sourcesContent": ["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nimport { SpectrumElement } from '@spectrum-web-components/base';\nimport { reparentChildren } from '@spectrum-web-components/shared/src/reparent-children.js';\n\nimport type {\n OpenableElement,\n OverlayOptions,\n OverlayOptionsV1,\n OverlayState,\n OverlayTypes,\n TriggerInteractionsV1,\n} from './overlay-types.dev.js'\nimport { Overlay } from './Overlay.dev.js'\nimport type { VirtualTrigger } from './VirtualTrigger.dev.js'\nimport { OverlayTimer } from './overlay-timer.dev.js'\nimport { PlacementController } from './PlacementController.dev.js'\n\nexport const overlayTimer = new OverlayTimer();\n\nexport const noop = (): void => {\n return;\n};\n\nexport class BeforetoggleClosedEvent extends Event {\n currentState = 'open';\n newState = 'closed';\n constructor() {\n super('beforetoggle', {\n bubbles: false,\n composed: false,\n });\n }\n}\n\nexport class BeforetoggleOpenEvent extends Event {\n currentState = 'closed';\n newState = 'open';\n constructor() {\n super('beforetoggle', {\n bubbles: false,\n composed: false,\n });\n }\n}\n\n/**\n * Apply a \"transitionend\" listener to an element that may not transition but\n * guarantee the callback will be fired either way.\n *\n * @param el {HTMLElement} - Target of the \"transition\" listeners.\n * @param action {Function} - Method to trigger the \"transition\".\n * @param cb {Function} - Callback to trigger when the \"transition\" has ended.\n */\nexport const guaranteedAllTransitionend = (\n el: HTMLElement,\n action: () => void,\n cb: () => void\n): void => {\n const abortController = new AbortController();\n const runningTransitions = new Map<string, number>();\n const cleanup = (): void => {\n abortController.abort();\n cb();\n };\n let guarantee2: number;\n let guarantee3: number;\n // WebKit fires `transitionrun` a little earlier, the multiple guarantees here\n // allow WebKit to be caught, but doesn't remove the animation listener until\n // after it would have fired in Chromium.\n const guarantee1 = requestAnimationFrame(() => {\n guarantee2 = requestAnimationFrame(() => {\n guarantee3 = requestAnimationFrame(() => {\n cleanup();\n });\n });\n });\n const handleTransitionend = (event: TransitionEvent): void => {\n if (event.target !== el) {\n return;\n }\n runningTransitions.set(\n event.propertyName,\n (runningTransitions.get(event.propertyName) as number) - 1\n );\n if (!runningTransitions.get(event.propertyName)) {\n runningTransitions.delete(event.propertyName);\n }\n if (runningTransitions.size === 0) {\n cleanup();\n }\n };\n const handleTransitionrun = (event: TransitionEvent): void => {\n if (event.target !== el) {\n return;\n }\n if (!runningTransitions.has(event.propertyName)) {\n runningTransitions.set(event.propertyName, 0);\n }\n runningTransitions.set(\n event.propertyName,\n (runningTransitions.get(event.propertyName) as number) + 1\n );\n cancelAnimationFrame(guarantee1);\n cancelAnimationFrame(guarantee2);\n cancelAnimationFrame(guarantee3);\n };\n el.addEventListener('transitionrun', handleTransitionrun, {\n signal: abortController.signal,\n });\n el.addEventListener('transitionend', handleTransitionend, {\n signal: abortController.signal,\n });\n el.addEventListener('transitioncancel', handleTransitionend, {\n signal: abortController.signal,\n });\n action();\n};\n\nexport function nextFrame(): Promise<void> {\n return new Promise((res) => requestAnimationFrame(() => res()));\n}\n\nexport function forcePaint(): void {\n // force the browser to paint\n document.body.offsetHeight;\n}\n\nexport class AbstractOverlay extends SpectrumElement {\n protected async applyFocus(\n _targetOpenState: boolean,\n _focusEl: HTMLElement | null\n ): Promise<void> {\n return;\n }\n delayed!: boolean;\n dialogEl!: HTMLDialogElement & {\n showPopover(): void;\n hidePopover(): void;\n };\n dispose = noop;\n protected async ensureOnDOM(_targetOpenState: boolean): Promise<void> {\n return;\n }\n elements!: OpenableElement[];\n protected async makeTransition(\n _targetOpenState: boolean\n ): Promise<HTMLElement | null> {\n return null;\n }\n protected async manageDelay(_targetOpenState: boolean): Promise<void> {\n return;\n }\n protected async manageDialogOpen(): Promise<void> {\n return;\n }\n protected async managePopoverOpen(): Promise<void> {\n return;\n }\n protected managePosition(): void {\n return;\n }\n get open(): boolean {\n return false;\n }\n set open(_open: boolean) {\n return;\n }\n protected placementController!: PlacementController;\n receivesFocus!: 'true' | 'false' | 'auto';\n get state(): OverlayState {\n return 'closed';\n }\n set state(_state: OverlayState) {\n return;\n }\n protected _state!: OverlayState;\n triggerElement!: HTMLElement | VirtualTrigger | null;\n type!: OverlayTypes;\n\n public manuallyKeepOpen(): void {\n return;\n }\n\n public static update(): void {\n const overlayUpdateEvent = new CustomEvent('sp-update-overlays', {\n bubbles: true,\n composed: true,\n cancelable: true,\n });\n document.dispatchEvent(overlayUpdateEvent);\n }\n\n public static async open(\n trigger: HTMLElement,\n interaction: TriggerInteractionsV1,\n content: HTMLElement,\n optionsV1: OverlayOptionsV1\n ): Promise<() => void>;\n public static async open(\n content: HTMLElement,\n options?: OverlayOptions\n ): Promise<Overlay>;\n public static async open(\n triggerOrContent: HTMLElement,\n interactionOrOptions:\n | TriggerInteractionsV1\n | OverlayOptions\n | undefined,\n content?: HTMLElement,\n optionsV1?: OverlayOptionsV1\n ): Promise<Overlay | (() => void)> {\n const v2 = arguments.length === 2;\n const overlayContent = content || triggerOrContent;\n const overlay = new Overlay();\n let restored = false;\n overlay.dispose = () => {\n overlay.addEventListener('sp-closed', () => {\n if (!restored) {\n restoreContent();\n restored = true;\n }\n requestAnimationFrame(() => {\n overlay.remove();\n });\n });\n overlay.open = false;\n overlay.dispose = noop;\n };\n /**\n * Since content must exist in an <sp-overlay>, we need a way to get it there.\n * The best & most-direct way is to declaratively use an <sp-overlay> element,\n * but for imperative users, we'll reparent content into an overlay that we've created for them.\n **/\n const restoreContent = reparentChildren([overlayContent], overlay, {\n position: 'beforeend',\n prepareCallback: (el) => {\n // Ensure that content to be overlaid is no longer targetted to a specific `slot`.\n // This allow for it to be visible in the overlaid context.\n const slot = el.slot;\n el.removeAttribute('slot');\n return () => {\n el.slot = slot;\n };\n },\n });\n\n const v1 = !v2 && overlayContent && optionsV1;\n if (v1) {\n if (window.__swc.DEBUG) {\n window.__swc.warn(\n overlay,\n `You are interacting with an ${overlay.localName} element via a deprecated imperative API. This API will be removed in a future version of the SWC library. Consider leveraging an ${overlay.localName} directly.`,\n 'https://opensource.adobe.com/spectrum-web-components/components/overlay/',\n { level: 'deprecation' }\n );\n }\n const trigger = triggerOrContent;\n const interaction = interactionOrOptions;\n const options = optionsV1;\n overlay.delayed =\n options.delayed || overlayContent.hasAttribute('delayed');\n overlay.receivesFocus = options.receivesFocus ?? 'auto';\n overlay.triggerElement = options.virtualTrigger || trigger;\n overlay.type =\n interaction === 'modal'\n ? 'modal'\n : interaction === 'hover'\n ? 'hint'\n : 'auto';\n overlay.offset = options.offset ?? 6;\n overlay.placement = options.placement;\n overlay.willPreventClose = !!options.notImmediatelyClosable;\n trigger.insertAdjacentElement('afterend', overlay);\n await overlay.updateComplete;\n overlay.open = true;\n return overlay.dispose;\n }\n\n const options = interactionOrOptions as OverlayOptions;\n overlay.append(overlayContent);\n overlay.delayed =\n options.delayed || overlayContent.hasAttribute('delayed');\n overlay.receivesFocus = options.receivesFocus ?? 'auto';\n overlay.triggerElement = options.trigger || null;\n overlay.type = options.type || 'modal';\n overlay.offset = options.offset ?? 6;\n overlay.placement = options.placement;\n overlay.willPreventClose = !!options.notImmediatelyClosable;\n overlay.updateComplete.then(() => {\n // Do we want to \"open\" this path, or leave that to the consumer?\n overlay.open = true;\n });\n return overlay;\n }\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["options"]
|
|
7
|
+
}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use strict";import{SpectrumElement as E}from"@spectrum-web-components/base";import{reparentChildren as T}from"@spectrum-web-components/shared/src/reparent-children.js";import{Overlay as w}from"./Overlay.js";import{OverlayTimer as P}from"./overlay-timer.js";export const overlayTimer=new P,noop=()=>{};export class BeforetoggleClosedEvent extends Event{constructor(){super("beforetoggle",{bubbles:!1,composed:!1});this.currentState="open";this.newState="closed"}}export class BeforetoggleOpenEvent extends Event{constructor(){super("beforetoggle",{bubbles:!1,composed:!1});this.currentState="closed";this.newState="open"}}export const guaranteedAllTransitionend=(n,d,t)=>{const a=new AbortController,o=new Map,c=()=>{a.abort(),t()};let u,s;const e=requestAnimationFrame(()=>{u=requestAnimationFrame(()=>{s=requestAnimationFrame(()=>{c()})})}),m=r=>{r.target===n&&(o.set(r.propertyName,o.get(r.propertyName)-1),o.get(r.propertyName)||o.delete(r.propertyName),o.size===0&&c())},y=r=>{r.target===n&&(o.has(r.propertyName)||o.set(r.propertyName,0),o.set(r.propertyName,o.get(r.propertyName)+1),cancelAnimationFrame(e),cancelAnimationFrame(u),cancelAnimationFrame(s))};n.addEventListener("transitionrun",y,{signal:a.signal}),n.addEventListener("transitionend",m,{signal:a.signal}),n.addEventListener("transitioncancel",m,{signal:a.signal}),d()};export function nextFrame(){return new Promise(n=>requestAnimationFrame(()=>n()))}export function forcePaint(){document.body.offsetHeight}export class AbstractOverlay extends E{constructor(){super(...arguments);this.dispose=noop}async applyFocus(t,a){}async ensureOnDOM(t){}async makeTransition(t){return null}async manageDelay(t){}async manageDialogOpen(){}async managePopoverOpen(){}managePosition(){}get open(){return!1}set open(t){}get state(){return"closed"}set state(t){}manuallyKeepOpen(){}static update(){const t=new CustomEvent("sp-update-overlays",{bubbles:!0,composed:!0,cancelable:!0});document.dispatchEvent(t)}static async open(t,a,o,c){var g,b,f,O;const u=arguments.length===2,s=o||t,e=new w;let m=!1;e.dispose=()=>{e.addEventListener("sp-closed",()=>{m||(y(),m=!0),requestAnimationFrame(()=>{e.remove()})}),e.open=!1,e.dispose=noop};const y=T([s],e,{position:"beforeend",prepareCallback:l=>{const v=l.slot;return l.removeAttribute("slot"),()=>{l.slot=v}}});if(!u&&s&&c){const l=t,v=a,p=c;return e.delayed=p.delayed||s.hasAttribute("delayed"),e.receivesFocus=(g=p.receivesFocus)!=null?g:"auto",e.triggerElement=p.virtualTrigger||l,e.type=v==="modal"?"modal":v==="hover"?"hint":"auto",e.offset=(b=p.offset)!=null?b:6,e.placement=p.placement,e.willPreventClose=!!p.notImmediatelyClosable,l.insertAdjacentElement("afterend",e),await e.updateComplete,e.open=!0,e.dispose}const i=a;return e.append(s),e.delayed=i.delayed||s.hasAttribute("delayed"),e.receivesFocus=(f=i.receivesFocus)!=null?f:"auto",e.triggerElement=i.trigger||null,e.type=i.type||"modal",e.offset=(O=i.offset)!=null?O:6,e.placement=i.placement,e.willPreventClose=!!i.notImmediatelyClosable,e.updateComplete.then(()=>{e.open=!0}),e}}
|
|
2
|
+
//# sourceMappingURL=AbstractOverlay.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["AbstractOverlay.ts"],
|
|
4
|
+
"sourcesContent": ["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nimport { SpectrumElement } from '@spectrum-web-components/base';\nimport { reparentChildren } from '@spectrum-web-components/shared/src/reparent-children.js';\n\nimport type {\n OpenableElement,\n OverlayOptions,\n OverlayOptionsV1,\n OverlayState,\n OverlayTypes,\n TriggerInteractionsV1,\n} from './overlay-types.js';\nimport { Overlay } from './Overlay.js';\nimport type { VirtualTrigger } from './VirtualTrigger.js';\nimport { OverlayTimer } from './overlay-timer.js';\nimport { PlacementController } from './PlacementController.js';\n\nexport const overlayTimer = new OverlayTimer();\n\nexport const noop = (): void => {\n return;\n};\n\nexport class BeforetoggleClosedEvent extends Event {\n currentState = 'open';\n newState = 'closed';\n constructor() {\n super('beforetoggle', {\n bubbles: false,\n composed: false,\n });\n }\n}\n\nexport class BeforetoggleOpenEvent extends Event {\n currentState = 'closed';\n newState = 'open';\n constructor() {\n super('beforetoggle', {\n bubbles: false,\n composed: false,\n });\n }\n}\n\n/**\n * Apply a \"transitionend\" listener to an element that may not transition but\n * guarantee the callback will be fired either way.\n *\n * @param el {HTMLElement} - Target of the \"transition\" listeners.\n * @param action {Function} - Method to trigger the \"transition\".\n * @param cb {Function} - Callback to trigger when the \"transition\" has ended.\n */\nexport const guaranteedAllTransitionend = (\n el: HTMLElement,\n action: () => void,\n cb: () => void\n): void => {\n const abortController = new AbortController();\n const runningTransitions = new Map<string, number>();\n const cleanup = (): void => {\n abortController.abort();\n cb();\n };\n let guarantee2: number;\n let guarantee3: number;\n // WebKit fires `transitionrun` a little earlier, the multiple guarantees here\n // allow WebKit to be caught, but doesn't remove the animation listener until\n // after it would have fired in Chromium.\n const guarantee1 = requestAnimationFrame(() => {\n guarantee2 = requestAnimationFrame(() => {\n guarantee3 = requestAnimationFrame(() => {\n cleanup();\n });\n });\n });\n const handleTransitionend = (event: TransitionEvent): void => {\n if (event.target !== el) {\n return;\n }\n runningTransitions.set(\n event.propertyName,\n (runningTransitions.get(event.propertyName) as number) - 1\n );\n if (!runningTransitions.get(event.propertyName)) {\n runningTransitions.delete(event.propertyName);\n }\n if (runningTransitions.size === 0) {\n cleanup();\n }\n };\n const handleTransitionrun = (event: TransitionEvent): void => {\n if (event.target !== el) {\n return;\n }\n if (!runningTransitions.has(event.propertyName)) {\n runningTransitions.set(event.propertyName, 0);\n }\n runningTransitions.set(\n event.propertyName,\n (runningTransitions.get(event.propertyName) as number) + 1\n );\n cancelAnimationFrame(guarantee1);\n cancelAnimationFrame(guarantee2);\n cancelAnimationFrame(guarantee3);\n };\n el.addEventListener('transitionrun', handleTransitionrun, {\n signal: abortController.signal,\n });\n el.addEventListener('transitionend', handleTransitionend, {\n signal: abortController.signal,\n });\n el.addEventListener('transitioncancel', handleTransitionend, {\n signal: abortController.signal,\n });\n action();\n};\n\nexport function nextFrame(): Promise<void> {\n return new Promise((res) => requestAnimationFrame(() => res()));\n}\n\nexport function forcePaint(): void {\n // force the browser to paint\n document.body.offsetHeight;\n}\n\nexport class AbstractOverlay extends SpectrumElement {\n protected async applyFocus(\n _targetOpenState: boolean,\n _focusEl: HTMLElement | null\n ): Promise<void> {\n return;\n }\n delayed!: boolean;\n dialogEl!: HTMLDialogElement & {\n showPopover(): void;\n hidePopover(): void;\n };\n dispose = noop;\n protected async ensureOnDOM(_targetOpenState: boolean): Promise<void> {\n return;\n }\n elements!: OpenableElement[];\n protected async makeTransition(\n _targetOpenState: boolean\n ): Promise<HTMLElement | null> {\n return null;\n }\n protected async manageDelay(_targetOpenState: boolean): Promise<void> {\n return;\n }\n protected async manageDialogOpen(): Promise<void> {\n return;\n }\n protected async managePopoverOpen(): Promise<void> {\n return;\n }\n protected managePosition(): void {\n return;\n }\n get open(): boolean {\n return false;\n }\n set open(_open: boolean) {\n return;\n }\n protected placementController!: PlacementController;\n receivesFocus!: 'true' | 'false' | 'auto';\n get state(): OverlayState {\n return 'closed';\n }\n set state(_state: OverlayState) {\n return;\n }\n protected _state!: OverlayState;\n triggerElement!: HTMLElement | VirtualTrigger | null;\n type!: OverlayTypes;\n\n public manuallyKeepOpen(): void {\n return;\n }\n\n public static update(): void {\n const overlayUpdateEvent = new CustomEvent('sp-update-overlays', {\n bubbles: true,\n composed: true,\n cancelable: true,\n });\n document.dispatchEvent(overlayUpdateEvent);\n }\n\n public static async open(\n trigger: HTMLElement,\n interaction: TriggerInteractionsV1,\n content: HTMLElement,\n optionsV1: OverlayOptionsV1\n ): Promise<() => void>;\n public static async open(\n content: HTMLElement,\n options?: OverlayOptions\n ): Promise<Overlay>;\n public static async open(\n triggerOrContent: HTMLElement,\n interactionOrOptions:\n | TriggerInteractionsV1\n | OverlayOptions\n | undefined,\n content?: HTMLElement,\n optionsV1?: OverlayOptionsV1\n ): Promise<Overlay | (() => void)> {\n const v2 = arguments.length === 2;\n const overlayContent = content || triggerOrContent;\n const overlay = new Overlay();\n let restored = false;\n overlay.dispose = () => {\n overlay.addEventListener('sp-closed', () => {\n if (!restored) {\n restoreContent();\n restored = true;\n }\n requestAnimationFrame(() => {\n overlay.remove();\n });\n });\n overlay.open = false;\n overlay.dispose = noop;\n };\n /**\n * Since content must exist in an <sp-overlay>, we need a way to get it there.\n * The best & most-direct way is to declaratively use an <sp-overlay> element,\n * but for imperative users, we'll reparent content into an overlay that we've created for them.\n **/\n const restoreContent = reparentChildren([overlayContent], overlay, {\n position: 'beforeend',\n prepareCallback: (el) => {\n // Ensure that content to be overlaid is no longer targetted to a specific `slot`.\n // This allow for it to be visible in the overlaid context.\n const slot = el.slot;\n el.removeAttribute('slot');\n return () => {\n el.slot = slot;\n };\n },\n });\n\n const v1 = !v2 && overlayContent && optionsV1;\n if (v1) {\n if (window.__swc.DEBUG) {\n window.__swc.warn(\n overlay,\n `You are interacting with an ${overlay.localName} element via a deprecated imperative API. This API will be removed in a future version of the SWC library. Consider leveraging an ${overlay.localName} directly.`,\n 'https://opensource.adobe.com/spectrum-web-components/components/overlay/',\n { level: 'deprecation' }\n );\n }\n const trigger = triggerOrContent;\n const interaction = interactionOrOptions;\n const options = optionsV1;\n overlay.delayed =\n options.delayed || overlayContent.hasAttribute('delayed');\n overlay.receivesFocus = options.receivesFocus ?? 'auto';\n overlay.triggerElement = options.virtualTrigger || trigger;\n overlay.type =\n interaction === 'modal'\n ? 'modal'\n : interaction === 'hover'\n ? 'hint'\n : 'auto';\n overlay.offset = options.offset ?? 6;\n overlay.placement = options.placement;\n overlay.willPreventClose = !!options.notImmediatelyClosable;\n trigger.insertAdjacentElement('afterend', overlay);\n await overlay.updateComplete;\n overlay.open = true;\n return overlay.dispose;\n }\n\n const options = interactionOrOptions as OverlayOptions;\n overlay.append(overlayContent);\n overlay.delayed =\n options.delayed || overlayContent.hasAttribute('delayed');\n overlay.receivesFocus = options.receivesFocus ?? 'auto';\n overlay.triggerElement = options.trigger || null;\n overlay.type = options.type || 'modal';\n overlay.offset = options.offset ?? 6;\n overlay.placement = options.placement;\n overlay.willPreventClose = !!options.notImmediatelyClosable;\n overlay.updateComplete.then(() => {\n // Do we want to \"open\" this path, or leave that to the consumer?\n overlay.open = true;\n });\n return overlay;\n }\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["SpectrumElement", "reparentChildren", "Overlay", "OverlayTimer", "el", "action", "cb", "abortController", "runningTransitions", "cleanup", "guarantee2", "guarantee3", "guarantee1", "handleTransitionend", "event", "handleTransitionrun", "res", "_targetOpenState", "_focusEl", "_open", "_state", "overlayUpdateEvent", "triggerOrContent", "interactionOrOptions", "content", "optionsV1", "_a", "_b", "_c", "_d", "v2", "overlayContent", "overlay", "restored", "restoreContent", "slot", "trigger", "interaction", "options"]
|
|
7
|
+
}
|