@spectrum-web-components/overlay 0.42.3 → 0.42.5
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 +48 -0
- package/package.json +7 -7
- package/src/HoverController.dev.js +5 -10
- package/src/HoverController.dev.js.map +2 -2
- package/src/HoverController.js +1 -1
- package/src/HoverController.js.map +2 -2
- package/src/InteractionController.d.ts +2 -1
- package/src/InteractionController.dev.js +7 -5
- package/src/InteractionController.dev.js.map +2 -2
- package/src/InteractionController.js +1 -1
- package/src/InteractionController.js.map +2 -2
- package/src/LongpressController.dev.js +5 -10
- package/src/LongpressController.dev.js.map +1 -1
- package/src/Overlay.dev.js +12 -23
- package/src/Overlay.dev.js.map +2 -2
- package/src/Overlay.js.map +2 -2
- package/src/OverlayStack.dev.js +7 -15
- package/src/OverlayStack.dev.js.map +2 -2
- package/src/OverlayStack.js +1 -1
- package/src/OverlayStack.js.map +3 -3
- package/src/OverlayTrigger.dev.js +1 -2
- package/src/OverlayTrigger.dev.js.map +1 -1
- package/src/PlacementController.dev.js +3 -6
- package/src/PlacementController.dev.js.map +1 -1
- package/src/overlay-trigger-directive.d.ts +2 -1
- package/src/overlay-trigger-directive.dev.js +17 -8
- package/src/overlay-trigger-directive.dev.js.map +2 -2
- package/src/overlay-trigger-directive.js +1 -1
- package/src/overlay-trigger-directive.js.map +3 -3
- package/src/slottable-request-directive.d.ts +1 -1
- package/src/slottable-request-directive.dev.js +5 -3
- package/src/slottable-request-directive.dev.js.map +2 -2
- package/src/slottable-request-directive.js +1 -1
- package/src/slottable-request-directive.js.map +2 -2
- package/stories/overlay-directive.stories.js +95 -3
- package/stories/overlay-directive.stories.js.map +2 -2
- package/stories/overlay-element.stories.js +22 -0
- package/stories/overlay-element.stories.js.map +2 -2
- package/stories/overlay-story-components.js +6 -12
- package/stories/overlay-story-components.js.map +1 -1
- package/stories/overlay.stories.js +1 -2
- package/stories/overlay.stories.js.map +1 -1
- package/test/overlay-element.test.js +69 -28
- package/test/overlay-element.test.js.map +2 -2
package/custom-elements.json
CHANGED
|
@@ -672,6 +672,19 @@
|
|
|
672
672
|
"module": "src/InteractionController.js"
|
|
673
673
|
}
|
|
674
674
|
},
|
|
675
|
+
{
|
|
676
|
+
"kind": "field",
|
|
677
|
+
"name": "isLazilyOpen",
|
|
678
|
+
"type": {
|
|
679
|
+
"text": "boolean"
|
|
680
|
+
},
|
|
681
|
+
"privacy": "private",
|
|
682
|
+
"default": "false",
|
|
683
|
+
"inheritedFrom": {
|
|
684
|
+
"name": "InteractionController",
|
|
685
|
+
"module": "src/InteractionController.js"
|
|
686
|
+
}
|
|
687
|
+
},
|
|
675
688
|
{
|
|
676
689
|
"kind": "field",
|
|
677
690
|
"name": "open",
|
|
@@ -1060,6 +1073,19 @@
|
|
|
1060
1073
|
"module": "src/InteractionController.js"
|
|
1061
1074
|
}
|
|
1062
1075
|
},
|
|
1076
|
+
{
|
|
1077
|
+
"kind": "field",
|
|
1078
|
+
"name": "isLazilyOpen",
|
|
1079
|
+
"type": {
|
|
1080
|
+
"text": "boolean"
|
|
1081
|
+
},
|
|
1082
|
+
"privacy": "private",
|
|
1083
|
+
"default": "false",
|
|
1084
|
+
"inheritedFrom": {
|
|
1085
|
+
"name": "InteractionController",
|
|
1086
|
+
"module": "src/InteractionController.js"
|
|
1087
|
+
}
|
|
1088
|
+
},
|
|
1063
1089
|
{
|
|
1064
1090
|
"kind": "field",
|
|
1065
1091
|
"name": "open",
|
|
@@ -1227,6 +1253,15 @@
|
|
|
1227
1253
|
"privacy": "private",
|
|
1228
1254
|
"default": "handleOverlayReady"
|
|
1229
1255
|
},
|
|
1256
|
+
{
|
|
1257
|
+
"kind": "field",
|
|
1258
|
+
"name": "isLazilyOpen",
|
|
1259
|
+
"type": {
|
|
1260
|
+
"text": "boolean"
|
|
1261
|
+
},
|
|
1262
|
+
"privacy": "private",
|
|
1263
|
+
"default": "false"
|
|
1264
|
+
},
|
|
1230
1265
|
{
|
|
1231
1266
|
"kind": "field",
|
|
1232
1267
|
"name": "open",
|
|
@@ -1572,6 +1607,19 @@
|
|
|
1572
1607
|
"module": "src/InteractionController.js"
|
|
1573
1608
|
}
|
|
1574
1609
|
},
|
|
1610
|
+
{
|
|
1611
|
+
"kind": "field",
|
|
1612
|
+
"name": "isLazilyOpen",
|
|
1613
|
+
"type": {
|
|
1614
|
+
"text": "boolean"
|
|
1615
|
+
},
|
|
1616
|
+
"privacy": "private",
|
|
1617
|
+
"default": "false",
|
|
1618
|
+
"inheritedFrom": {
|
|
1619
|
+
"name": "InteractionController",
|
|
1620
|
+
"module": "src/InteractionController.js"
|
|
1621
|
+
}
|
|
1622
|
+
},
|
|
1575
1623
|
{
|
|
1576
1624
|
"kind": "field",
|
|
1577
1625
|
"name": "open",
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@spectrum-web-components/overlay",
|
|
3
|
-
"version": "0.42.
|
|
3
|
+
"version": "0.42.5",
|
|
4
4
|
"publishConfig": {
|
|
5
5
|
"access": "public"
|
|
6
6
|
},
|
|
@@ -160,11 +160,11 @@
|
|
|
160
160
|
"dependencies": {
|
|
161
161
|
"@floating-ui/dom": "^1.6.1",
|
|
162
162
|
"@floating-ui/utils": "^0.2.1",
|
|
163
|
-
"@spectrum-web-components/action-button": "^0.42.
|
|
164
|
-
"@spectrum-web-components/base": "^0.42.
|
|
165
|
-
"@spectrum-web-components/reactive-controllers": "^0.42.
|
|
166
|
-
"@spectrum-web-components/shared": "^0.42.
|
|
167
|
-
"@spectrum-web-components/theme": "^0.42.
|
|
163
|
+
"@spectrum-web-components/action-button": "^0.42.5",
|
|
164
|
+
"@spectrum-web-components/base": "^0.42.5",
|
|
165
|
+
"@spectrum-web-components/reactive-controllers": "^0.42.5",
|
|
166
|
+
"@spectrum-web-components/shared": "^0.42.5",
|
|
167
|
+
"@spectrum-web-components/theme": "^0.42.5"
|
|
168
168
|
},
|
|
169
169
|
"types": "./src/index.d.ts",
|
|
170
170
|
"customElements": "custom-elements.json",
|
|
@@ -176,5 +176,5 @@
|
|
|
176
176
|
"./stories/overlay-story-components.js",
|
|
177
177
|
"./**/*.dev.js"
|
|
178
178
|
],
|
|
179
|
-
"gitHead": "
|
|
179
|
+
"gitHead": "f29fd737947945de8cd6f5bc03fb389d386c9c3a"
|
|
180
180
|
}
|
|
@@ -16,8 +16,7 @@ export class HoverController extends InteractionController {
|
|
|
16
16
|
this.pointerentered = false;
|
|
17
17
|
}
|
|
18
18
|
handleTargetFocusin() {
|
|
19
|
-
|
|
20
|
-
if (!((_a = document.activeElement) == null ? void 0 : _a.matches(":focus-visible"))) {
|
|
19
|
+
if (!this.target.matches(":focus-visible")) {
|
|
21
20
|
return;
|
|
22
21
|
}
|
|
23
22
|
this.open = true;
|
|
@@ -25,8 +24,7 @@ export class HoverController extends InteractionController {
|
|
|
25
24
|
}
|
|
26
25
|
handleTargetFocusout() {
|
|
27
26
|
this.focusedin = false;
|
|
28
|
-
if (this.pointerentered)
|
|
29
|
-
return;
|
|
27
|
+
if (this.pointerentered) return;
|
|
30
28
|
this.open = false;
|
|
31
29
|
}
|
|
32
30
|
handleTargetPointerenter() {
|
|
@@ -35,8 +33,7 @@ export class HoverController extends InteractionController {
|
|
|
35
33
|
clearTimeout(this.hoverTimeout);
|
|
36
34
|
this.hoverTimeout = void 0;
|
|
37
35
|
}
|
|
38
|
-
if ((_a = this.overlay) == null ? void 0 : _a.disabled)
|
|
39
|
-
return;
|
|
36
|
+
if ((_a = this.overlay) == null ? void 0 : _a.disabled) return;
|
|
40
37
|
this.open = true;
|
|
41
38
|
this.pointerentered = true;
|
|
42
39
|
}
|
|
@@ -55,8 +52,7 @@ export class HoverController extends InteractionController {
|
|
|
55
52
|
this.doPointerleave();
|
|
56
53
|
}
|
|
57
54
|
prepareDescription() {
|
|
58
|
-
if (!this.overlay.elements.length)
|
|
59
|
-
return;
|
|
55
|
+
if (!this.overlay.elements.length) return;
|
|
60
56
|
const triggerRoot = this.target.getRootNode();
|
|
61
57
|
const contentRoot = this.overlay.elements[0].getRootNode();
|
|
62
58
|
const overlayRoot = this.overlay.getRootNode();
|
|
@@ -103,8 +99,7 @@ export class HoverController extends InteractionController {
|
|
|
103
99
|
doPointerleave() {
|
|
104
100
|
this.pointerentered = false;
|
|
105
101
|
const triggerElement = this.target;
|
|
106
|
-
if (this.focusedin && triggerElement.matches(":focus-visible"))
|
|
107
|
-
return;
|
|
102
|
+
if (this.focusedin && triggerElement.matches(":focus-visible")) return;
|
|
108
103
|
this.hoverTimeout = setTimeout(() => {
|
|
109
104
|
this.open = false;
|
|
110
105
|
}, HOVER_DELAY);
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["HoverController.ts"],
|
|
4
|
-
"sourcesContent": ["/*\nCopyright 2024 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*/\n\nimport { conditionAttributeWithId } from '@spectrum-web-components/base/src/condition-attribute-with-id.js';\nimport { randomID } from '@spectrum-web-components/shared/src/random-id.js';\n\nimport {\n InteractionController,\n InteractionTypes,\n} from './InteractionController.dev.js'\nimport { noop } from './AbstractOverlay.dev.js'\n\nconst HOVER_DELAY = 300;\n\nexport class HoverController extends InteractionController {\n override type = InteractionTypes.hover;\n\n private elementIds: string[] = [];\n\n focusedin = false;\n\n private hoverTimeout?: ReturnType<typeof setTimeout>;\n\n pointerentered = false;\n\n handleTargetFocusin(): void {\n
|
|
5
|
-
"mappings": ";AAYA,SAAS,gCAAgC;AACzC,SAAS,gBAAgB;AAEzB;AAAA,EACI;AAAA,EACA;AAAA,OACG;AACP,SAAS,YAAY;AAErB,MAAM,cAAc;AAEb,aAAM,wBAAwB,sBAAsB;AAAA,EAApD;AAAA;AACH,SAAS,OAAO,iBAAiB;AAEjC,SAAQ,aAAuB,CAAC;AAEhC,qBAAY;AAIZ,0BAAiB;AAAA;AAAA,EAEjB,sBAA4B;
|
|
4
|
+
"sourcesContent": ["/*\nCopyright 2024 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*/\n\nimport { conditionAttributeWithId } from '@spectrum-web-components/base/src/condition-attribute-with-id.js';\nimport { randomID } from '@spectrum-web-components/shared/src/random-id.js';\n\nimport {\n InteractionController,\n InteractionTypes,\n} from './InteractionController.dev.js'\nimport { noop } from './AbstractOverlay.dev.js'\n\nconst HOVER_DELAY = 300;\n\nexport class HoverController extends InteractionController {\n override type = InteractionTypes.hover;\n\n private elementIds: string[] = [];\n\n focusedin = false;\n\n private hoverTimeout?: ReturnType<typeof setTimeout>;\n\n pointerentered = false;\n\n handleTargetFocusin(): void {\n if (!this.target.matches(':focus-visible')) {\n return;\n }\n this.open = true;\n this.focusedin = true;\n }\n\n handleTargetFocusout(): void {\n this.focusedin = false;\n if (this.pointerentered) return;\n this.open = false;\n }\n\n handleTargetPointerenter(): void {\n if (this.hoverTimeout) {\n clearTimeout(this.hoverTimeout);\n this.hoverTimeout = undefined;\n }\n if (this.overlay?.disabled) return;\n this.open = true;\n this.pointerentered = true;\n }\n\n handleTargetPointerleave(): void {\n this.doPointerleave();\n }\n\n // set a timeout once the pointer enters and the overlay is shown\n // give the user time to enter the overlay\n handleHostPointerenter(): void {\n if (this.hoverTimeout) {\n clearTimeout(this.hoverTimeout);\n this.hoverTimeout = undefined;\n }\n }\n\n handleHostPointerleave(): void {\n this.doPointerleave();\n }\n\n override prepareDescription(): void {\n // require \"content\" to apply relationship\n if (!this.overlay.elements.length) return;\n\n const triggerRoot = this.target.getRootNode();\n const contentRoot = this.overlay.elements[0].getRootNode();\n const overlayRoot = this.overlay.getRootNode();\n if (triggerRoot === overlayRoot) {\n this.prepareOverlayRelativeDescription();\n } else if (triggerRoot === contentRoot) {\n this.prepareContentRelativeDescription();\n }\n }\n\n private prepareOverlayRelativeDescription(): void {\n const releaseDescription = conditionAttributeWithId(\n this.target,\n 'aria-describedby',\n [this.overlay.id]\n );\n this.releaseDescription = () => {\n releaseDescription();\n this.releaseDescription = noop;\n };\n }\n\n private prepareContentRelativeDescription(): void {\n const elementIds: string[] = [];\n const appliedIds = this.overlay.elements.map((el) => {\n elementIds.push(el.id);\n if (!el.id) {\n el.id = `${this.overlay.tagName.toLowerCase()}-helper-${randomID()}`;\n }\n return el.id;\n });\n this.elementIds = elementIds;\n const releaseDescription = conditionAttributeWithId(\n this.target,\n 'aria-describedby',\n appliedIds\n );\n this.releaseDescription = () => {\n releaseDescription();\n this.overlay.elements.map((el, index) => {\n el.id = this.elementIds[index];\n });\n this.releaseDescription = noop;\n };\n }\n\n protected doPointerleave(): void {\n this.pointerentered = false;\n const triggerElement = this.target as HTMLElement;\n if (this.focusedin && triggerElement.matches(':focus-visible')) return;\n\n this.hoverTimeout = setTimeout(() => {\n this.open = false;\n }, HOVER_DELAY);\n }\n\n override init(): void {\n // Clean up listeners if they've already been bound\n this.abortController?.abort();\n this.abortController = new AbortController();\n const { signal } = this.abortController;\n this.target.addEventListener(\n 'focusin',\n () => this.handleTargetFocusin(),\n { signal }\n );\n this.target.addEventListener(\n 'focusout',\n () => this.handleTargetFocusout(),\n { signal }\n );\n this.target.addEventListener(\n 'pointerenter',\n () => this.handleTargetPointerenter(),\n { signal }\n );\n this.target.addEventListener(\n 'pointerleave',\n () => this.handleTargetPointerleave(),\n { signal }\n );\n if (this.overlay) {\n this.initOverlay();\n }\n }\n\n override initOverlay(): void {\n if (!this.abortController) {\n return;\n }\n const { signal } = this.abortController;\n this.overlay.addEventListener(\n 'pointerenter',\n () => this.handleHostPointerenter(),\n { signal }\n );\n this.overlay.addEventListener(\n 'pointerleave',\n () => this.handleHostPointerleave(),\n { signal }\n );\n }\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/src/HoverController.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";import{conditionAttributeWithId as o}from"@spectrum-web-components/base/src/condition-attribute-with-id.js";import{randomID as a}from"@spectrum-web-components/shared/src/random-id.js";import{InteractionController as l,InteractionTypes as h}from"./InteractionController.js";import{noop as s}from"./AbstractOverlay.js";const d=300;export class HoverController extends l{constructor(){super(...arguments);this.type=h.hover;this.elementIds=[];this.focusedin=!1;this.pointerentered=!1}handleTargetFocusin(){
|
|
1
|
+
"use strict";import{conditionAttributeWithId as o}from"@spectrum-web-components/base/src/condition-attribute-with-id.js";import{randomID as a}from"@spectrum-web-components/shared/src/random-id.js";import{InteractionController as l,InteractionTypes as h}from"./InteractionController.js";import{noop as s}from"./AbstractOverlay.js";const d=300;export class HoverController extends l{constructor(){super(...arguments);this.type=h.hover;this.elementIds=[];this.focusedin=!1;this.pointerentered=!1}handleTargetFocusin(){this.target.matches(":focus-visible")&&(this.open=!0,this.focusedin=!0)}handleTargetFocusout(){this.focusedin=!1,!this.pointerentered&&(this.open=!1)}handleTargetPointerenter(){var e;this.hoverTimeout&&(clearTimeout(this.hoverTimeout),this.hoverTimeout=void 0),!((e=this.overlay)!=null&&e.disabled)&&(this.open=!0,this.pointerentered=!0)}handleTargetPointerleave(){this.doPointerleave()}handleHostPointerenter(){this.hoverTimeout&&(clearTimeout(this.hoverTimeout),this.hoverTimeout=void 0)}handleHostPointerleave(){this.doPointerleave()}prepareDescription(){if(!this.overlay.elements.length)return;const e=this.target.getRootNode(),t=this.overlay.elements[0].getRootNode(),r=this.overlay.getRootNode();e===r?this.prepareOverlayRelativeDescription():e===t&&this.prepareContentRelativeDescription()}prepareOverlayRelativeDescription(){const e=o(this.target,"aria-describedby",[this.overlay.id]);this.releaseDescription=()=>{e(),this.releaseDescription=s}}prepareContentRelativeDescription(){const e=[],t=this.overlay.elements.map(i=>(e.push(i.id),i.id||(i.id=`${this.overlay.tagName.toLowerCase()}-helper-${a()}`),i.id));this.elementIds=e;const r=o(this.target,"aria-describedby",t);this.releaseDescription=()=>{r(),this.overlay.elements.map((i,n)=>{i.id=this.elementIds[n]}),this.releaseDescription=s}}doPointerleave(){this.pointerentered=!1;const e=this.target;this.focusedin&&e.matches(":focus-visible")||(this.hoverTimeout=setTimeout(()=>{this.open=!1},d))}init(){var t;(t=this.abortController)==null||t.abort(),this.abortController=new AbortController;const{signal:e}=this.abortController;this.target.addEventListener("focusin",()=>this.handleTargetFocusin(),{signal:e}),this.target.addEventListener("focusout",()=>this.handleTargetFocusout(),{signal:e}),this.target.addEventListener("pointerenter",()=>this.handleTargetPointerenter(),{signal:e}),this.target.addEventListener("pointerleave",()=>this.handleTargetPointerleave(),{signal:e}),this.overlay&&this.initOverlay()}initOverlay(){if(!this.abortController)return;const{signal:e}=this.abortController;this.overlay.addEventListener("pointerenter",()=>this.handleHostPointerenter(),{signal:e}),this.overlay.addEventListener("pointerleave",()=>this.handleHostPointerleave(),{signal:e})}}
|
|
2
2
|
//# sourceMappingURL=HoverController.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["HoverController.ts"],
|
|
4
|
-
"sourcesContent": ["/*\nCopyright 2024 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*/\n\nimport { conditionAttributeWithId } from '@spectrum-web-components/base/src/condition-attribute-with-id.js';\nimport { randomID } from '@spectrum-web-components/shared/src/random-id.js';\n\nimport {\n InteractionController,\n InteractionTypes,\n} from './InteractionController.js';\nimport { noop } from './AbstractOverlay.js';\n\nconst HOVER_DELAY = 300;\n\nexport class HoverController extends InteractionController {\n override type = InteractionTypes.hover;\n\n private elementIds: string[] = [];\n\n focusedin = false;\n\n private hoverTimeout?: ReturnType<typeof setTimeout>;\n\n pointerentered = false;\n\n handleTargetFocusin(): void {\n
|
|
5
|
-
"mappings": "aAYA,OAAS,4BAAAA,MAAgC,mEACzC,OAAS,YAAAC,MAAgB,mDAEzB,OACI,yBAAAC,EACA,oBAAAC,MACG,6BACP,OAAS,QAAAC,MAAY,uBAErB,MAAMC,EAAc,IAEb,aAAM,wBAAwBH,CAAsB,CAApD,kCACH,KAAS,KAAOC,EAAiB,MAEjC,KAAQ,WAAuB,CAAC,EAEhC,eAAY,GAIZ,oBAAiB,GAEjB,qBAA4B,
|
|
4
|
+
"sourcesContent": ["/*\nCopyright 2024 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*/\n\nimport { conditionAttributeWithId } from '@spectrum-web-components/base/src/condition-attribute-with-id.js';\nimport { randomID } from '@spectrum-web-components/shared/src/random-id.js';\n\nimport {\n InteractionController,\n InteractionTypes,\n} from './InteractionController.js';\nimport { noop } from './AbstractOverlay.js';\n\nconst HOVER_DELAY = 300;\n\nexport class HoverController extends InteractionController {\n override type = InteractionTypes.hover;\n\n private elementIds: string[] = [];\n\n focusedin = false;\n\n private hoverTimeout?: ReturnType<typeof setTimeout>;\n\n pointerentered = false;\n\n handleTargetFocusin(): void {\n if (!this.target.matches(':focus-visible')) {\n return;\n }\n this.open = true;\n this.focusedin = true;\n }\n\n handleTargetFocusout(): void {\n this.focusedin = false;\n if (this.pointerentered) return;\n this.open = false;\n }\n\n handleTargetPointerenter(): void {\n if (this.hoverTimeout) {\n clearTimeout(this.hoverTimeout);\n this.hoverTimeout = undefined;\n }\n if (this.overlay?.disabled) return;\n this.open = true;\n this.pointerentered = true;\n }\n\n handleTargetPointerleave(): void {\n this.doPointerleave();\n }\n\n // set a timeout once the pointer enters and the overlay is shown\n // give the user time to enter the overlay\n handleHostPointerenter(): void {\n if (this.hoverTimeout) {\n clearTimeout(this.hoverTimeout);\n this.hoverTimeout = undefined;\n }\n }\n\n handleHostPointerleave(): void {\n this.doPointerleave();\n }\n\n override prepareDescription(): void {\n // require \"content\" to apply relationship\n if (!this.overlay.elements.length) return;\n\n const triggerRoot = this.target.getRootNode();\n const contentRoot = this.overlay.elements[0].getRootNode();\n const overlayRoot = this.overlay.getRootNode();\n if (triggerRoot === overlayRoot) {\n this.prepareOverlayRelativeDescription();\n } else if (triggerRoot === contentRoot) {\n this.prepareContentRelativeDescription();\n }\n }\n\n private prepareOverlayRelativeDescription(): void {\n const releaseDescription = conditionAttributeWithId(\n this.target,\n 'aria-describedby',\n [this.overlay.id]\n );\n this.releaseDescription = () => {\n releaseDescription();\n this.releaseDescription = noop;\n };\n }\n\n private prepareContentRelativeDescription(): void {\n const elementIds: string[] = [];\n const appliedIds = this.overlay.elements.map((el) => {\n elementIds.push(el.id);\n if (!el.id) {\n el.id = `${this.overlay.tagName.toLowerCase()}-helper-${randomID()}`;\n }\n return el.id;\n });\n this.elementIds = elementIds;\n const releaseDescription = conditionAttributeWithId(\n this.target,\n 'aria-describedby',\n appliedIds\n );\n this.releaseDescription = () => {\n releaseDescription();\n this.overlay.elements.map((el, index) => {\n el.id = this.elementIds[index];\n });\n this.releaseDescription = noop;\n };\n }\n\n protected doPointerleave(): void {\n this.pointerentered = false;\n const triggerElement = this.target as HTMLElement;\n if (this.focusedin && triggerElement.matches(':focus-visible')) return;\n\n this.hoverTimeout = setTimeout(() => {\n this.open = false;\n }, HOVER_DELAY);\n }\n\n override init(): void {\n // Clean up listeners if they've already been bound\n this.abortController?.abort();\n this.abortController = new AbortController();\n const { signal } = this.abortController;\n this.target.addEventListener(\n 'focusin',\n () => this.handleTargetFocusin(),\n { signal }\n );\n this.target.addEventListener(\n 'focusout',\n () => this.handleTargetFocusout(),\n { signal }\n );\n this.target.addEventListener(\n 'pointerenter',\n () => this.handleTargetPointerenter(),\n { signal }\n );\n this.target.addEventListener(\n 'pointerleave',\n () => this.handleTargetPointerleave(),\n { signal }\n );\n if (this.overlay) {\n this.initOverlay();\n }\n }\n\n override initOverlay(): void {\n if (!this.abortController) {\n return;\n }\n const { signal } = this.abortController;\n this.overlay.addEventListener(\n 'pointerenter',\n () => this.handleHostPointerenter(),\n { signal }\n );\n this.overlay.addEventListener(\n 'pointerleave',\n () => this.handleHostPointerleave(),\n { signal }\n );\n }\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["conditionAttributeWithId", "randomID", "InteractionController", "InteractionTypes", "noop", "HOVER_DELAY", "_a", "triggerRoot", "contentRoot", "overlayRoot", "releaseDescription", "elementIds", "appliedIds", "el", "index", "triggerElement", "signal"]
|
|
7
7
|
}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import type { ReactiveController } from '
|
|
1
|
+
import type { ReactiveController } from '@spectrum-web-components/base';
|
|
2
2
|
import { AbstractOverlay } from './AbstractOverlay.js';
|
|
3
3
|
export declare enum InteractionTypes {
|
|
4
4
|
'click' = 0,
|
|
@@ -15,6 +15,7 @@ export declare class InteractionController implements ReactiveController {
|
|
|
15
15
|
abortController: AbortController;
|
|
16
16
|
get activelyOpening(): boolean;
|
|
17
17
|
private handleOverlayReady?;
|
|
18
|
+
private isLazilyOpen;
|
|
18
19
|
get open(): boolean;
|
|
19
20
|
/**
|
|
20
21
|
* Set `open` against the associated Overlay lazily.
|
|
@@ -8,6 +8,8 @@ export var InteractionTypes = /* @__PURE__ */ ((InteractionTypes2) => {
|
|
|
8
8
|
export class InteractionController {
|
|
9
9
|
constructor(target, { overlay, isPersistent, handleOverlayReady }) {
|
|
10
10
|
this.target = target;
|
|
11
|
+
// Holds optimistic open state when an Overlay is not yet present
|
|
12
|
+
this.isLazilyOpen = false;
|
|
11
13
|
this.isPersistent = false;
|
|
12
14
|
this.isPersistent = !!isPersistent;
|
|
13
15
|
this.handleOverlayReady = handleOverlayReady;
|
|
@@ -21,12 +23,14 @@ export class InteractionController {
|
|
|
21
23
|
}
|
|
22
24
|
get open() {
|
|
23
25
|
var _a, _b;
|
|
24
|
-
return (_b = (_a = this.overlay) == null ? void 0 : _a.open) != null ? _b :
|
|
26
|
+
return (_b = (_a = this.overlay) == null ? void 0 : _a.open) != null ? _b : this.isLazilyOpen;
|
|
25
27
|
}
|
|
26
28
|
/**
|
|
27
29
|
* Set `open` against the associated Overlay lazily.
|
|
28
30
|
*/
|
|
29
31
|
set open(open) {
|
|
32
|
+
if (open === this.open) return;
|
|
33
|
+
this.isLazilyOpen = open;
|
|
30
34
|
if (this.overlay) {
|
|
31
35
|
this.overlay.open = open;
|
|
32
36
|
return;
|
|
@@ -46,10 +50,8 @@ export class InteractionController {
|
|
|
46
50
|
}
|
|
47
51
|
set overlay(overlay) {
|
|
48
52
|
var _a;
|
|
49
|
-
if (!overlay)
|
|
50
|
-
|
|
51
|
-
if (this.overlay === overlay)
|
|
52
|
-
return;
|
|
53
|
+
if (!overlay) return;
|
|
54
|
+
if (this.overlay === overlay) return;
|
|
53
55
|
if (this.overlay) {
|
|
54
56
|
this.overlay.removeController(this);
|
|
55
57
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["InteractionController.ts"],
|
|
4
|
-
"sourcesContent": ["/*\nCopyright 2024 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*/\n\nimport type { ReactiveController } from '
|
|
5
|
-
"mappings": ";AAeO,WAAK,mBAAL,kBAAKA,sBAAL;AACH,EAAAA,oCAAA;AACA,EAAAA,oCAAA;AACA,EAAAA,oCAAA;AAHQ,SAAAA;AAAA,GAAA;AAYL,aAAM,sBAAoD;AAAA,
|
|
4
|
+
"sourcesContent": ["/*\nCopyright 2024 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*/\n\nimport type { ReactiveController } from '@spectrum-web-components/base';\nimport { AbstractOverlay } from './AbstractOverlay.dev.js'\n\nexport enum InteractionTypes {\n 'click',\n 'hover',\n 'longpress',\n}\n\nexport type ControllerOptions = {\n overlay?: AbstractOverlay;\n handleOverlayReady?: (overlay: AbstractOverlay) => void;\n isPersistent?: boolean;\n};\n\nexport class InteractionController implements ReactiveController {\n abortController!: AbortController;\n\n get activelyOpening(): boolean {\n return false;\n }\n\n private handleOverlayReady?: (overlay: AbstractOverlay) => void;\n\n // Holds optimistic open state when an Overlay is not yet present\n private isLazilyOpen = false;\n\n public get open(): boolean {\n return this.overlay?.open ?? this.isLazilyOpen;\n }\n\n /**\n * Set `open` against the associated Overlay lazily.\n */\n public set open(open: boolean) {\n if (open === this.open) return;\n this.isLazilyOpen = open;\n if (this.overlay) {\n // If there already is an Overlay, apply the value of `open` directly.\n this.overlay.open = open;\n return;\n }\n if (!open) {\n // When `open` moves to `false` and there is not yet an Overlay,\n // assume that no Overlay and a closed Overlay are the same and return early.\n return;\n }\n // When there is no Overlay and `open` is moving to `true`, lazily import/create\n // an Overlay and apply that state to it.\n customElements\n .whenDefined('sp-overlay')\n .then(async (): Promise<void> => {\n const { Overlay } = await import('./Overlay.dev.js');\n this.overlay = new Overlay();\n this.overlay.open = true;\n });\n import('@spectrum-web-components/overlay/sp-overlay.js');\n }\n\n public get overlay(): AbstractOverlay {\n return this._overlay;\n }\n\n public set overlay(overlay: AbstractOverlay | undefined) {\n if (!overlay) return;\n if (this.overlay === overlay) return;\n if (this.overlay) {\n this.overlay.removeController(this);\n }\n this._overlay = overlay;\n this.overlay.addController(this);\n this.initOverlay();\n this.prepareDescription(this.target);\n this.handleOverlayReady?.(this.overlay);\n }\n\n private _overlay!: AbstractOverlay;\n\n protected isPersistent = false;\n\n type!: InteractionTypes;\n\n constructor(\n public target: HTMLElement,\n { overlay, isPersistent, handleOverlayReady }: ControllerOptions\n ) {\n this.isPersistent = !!isPersistent;\n this.handleOverlayReady = handleOverlayReady;\n if (this.isPersistent) {\n this.init();\n }\n this.overlay = overlay;\n }\n\n prepareDescription(_: HTMLElement): void {}\n\n releaseDescription(): void {}\n\n shouldCompleteOpen(): void {}\n\n /* c8 ignore next 3 */\n init(): void {\n // Abstract init() method.\n }\n\n /* c8 ignore next 3 */\n initOverlay(): void {\n // Abstract initOverlay() method.\n }\n\n abort(): void {\n this.releaseDescription();\n this.abortController?.abort();\n }\n\n hostConnected(): void {\n this.init();\n }\n\n hostDisconnected(): void {\n if (!this.isPersistent) {\n this.abort();\n }\n }\n}\n"],
|
|
5
|
+
"mappings": ";AAeO,WAAK,mBAAL,kBAAKA,sBAAL;AACH,EAAAA,oCAAA;AACA,EAAAA,oCAAA;AACA,EAAAA,oCAAA;AAHQ,SAAAA;AAAA,GAAA;AAYL,aAAM,sBAAoD;AAAA,EAmE7D,YACW,QACP,EAAE,SAAS,cAAc,mBAAmB,GAC9C;AAFS;AA1DX;AAAA,SAAQ,eAAe;AAqDvB,SAAU,eAAe;AAQrB,SAAK,eAAe,CAAC,CAAC;AACtB,SAAK,qBAAqB;AAC1B,QAAI,KAAK,cAAc;AACnB,WAAK,KAAK;AAAA,IACd;AACA,SAAK,UAAU;AAAA,EACnB;AAAA,EA1EA,IAAI,kBAA2B;AAC3B,WAAO;AAAA,EACX;AAAA,EAOA,IAAW,OAAgB;AAvC/B;AAwCQ,YAAO,gBAAK,YAAL,mBAAc,SAAd,YAAsB,KAAK;AAAA,EACtC;AAAA;AAAA;AAAA;AAAA,EAKA,IAAW,KAAK,MAAe;AAC3B,QAAI,SAAS,KAAK,KAAM;AACxB,SAAK,eAAe;AACpB,QAAI,KAAK,SAAS;AAEd,WAAK,QAAQ,OAAO;AACpB;AAAA,IACJ;AACA,QAAI,CAAC,MAAM;AAGP;AAAA,IACJ;AAGA,mBACK,YAAY,YAAY,EACxB,KAAK,YAA2B;AAC7B,YAAM,EAAE,QAAQ,IAAI,MAAM,OAAO,kBAAkB;AACnD,WAAK,UAAU,IAAI,QAAQ;AAC3B,WAAK,QAAQ,OAAO;AAAA,IACxB,CAAC;AACL,WAAO,gDAAgD;AAAA,EAC3D;AAAA,EAEA,IAAW,UAA2B;AAClC,WAAO,KAAK;AAAA,EAChB;AAAA,EAEA,IAAW,QAAQ,SAAsC;AA3E7D;AA4EQ,QAAI,CAAC,QAAS;AACd,QAAI,KAAK,YAAY,QAAS;AAC9B,QAAI,KAAK,SAAS;AACd,WAAK,QAAQ,iBAAiB,IAAI;AAAA,IACtC;AACA,SAAK,WAAW;AAChB,SAAK,QAAQ,cAAc,IAAI;AAC/B,SAAK,YAAY;AACjB,SAAK,mBAAmB,KAAK,MAAM;AACnC,eAAK,uBAAL,8BAA0B,KAAK;AAAA,EACnC;AAAA,EAoBA,mBAAmB,GAAsB;AAAA,EAAC;AAAA,EAE1C,qBAA2B;AAAA,EAAC;AAAA,EAE5B,qBAA2B;AAAA,EAAC;AAAA;AAAA,EAG5B,OAAa;AAAA,EAEb;AAAA;AAAA,EAGA,cAAoB;AAAA,EAEpB;AAAA,EAEA,QAAc;AA1HlB;AA2HQ,SAAK,mBAAmB;AACxB,eAAK,oBAAL,mBAAsB;AAAA,EAC1B;AAAA,EAEA,gBAAsB;AAClB,SAAK,KAAK;AAAA,EACd;AAAA,EAEA,mBAAyB;AACrB,QAAI,CAAC,KAAK,cAAc;AACpB,WAAK,MAAM;AAAA,IACf;AAAA,EACJ;AACJ;",
|
|
6
6
|
"names": ["InteractionTypes"]
|
|
7
7
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";export var InteractionTypes=(r=>(r[r.click=0]="click",r[r.hover=1]="hover",r[r.longpress=2]="longpress",r))(InteractionTypes||{});export class InteractionController{constructor(e,{overlay:t,isPersistent:r,handleOverlayReady:i}){this.target=e;this.isPersistent=!1;this.isPersistent=!!r,this.handleOverlayReady=i,this.isPersistent&&this.init(),this.overlay=t}get activelyOpening(){return!1}get open(){var e,t;return(t=(e=this.overlay)==null?void 0:e.open)!=null?t
|
|
1
|
+
"use strict";export var InteractionTypes=(r=>(r[r.click=0]="click",r[r.hover=1]="hover",r[r.longpress=2]="longpress",r))(InteractionTypes||{});export class InteractionController{constructor(e,{overlay:t,isPersistent:r,handleOverlayReady:i}){this.target=e;this.isLazilyOpen=!1;this.isPersistent=!1;this.isPersistent=!!r,this.handleOverlayReady=i,this.isPersistent&&this.init(),this.overlay=t}get activelyOpening(){return!1}get open(){var e,t;return(t=(e=this.overlay)==null?void 0:e.open)!=null?t:this.isLazilyOpen}set open(e){if(e!==this.open){if(this.isLazilyOpen=e,this.overlay){this.overlay.open=e;return}e&&(customElements.whenDefined("sp-overlay").then(async()=>{const{Overlay:t}=await import("./Overlay.js");this.overlay=new t,this.overlay.open=!0}),import("@spectrum-web-components/overlay/sp-overlay.js"))}}get overlay(){return this._overlay}set overlay(e){var t;e&&this.overlay!==e&&(this.overlay&&this.overlay.removeController(this),this._overlay=e,this.overlay.addController(this),this.initOverlay(),this.prepareDescription(this.target),(t=this.handleOverlayReady)==null||t.call(this,this.overlay))}prepareDescription(e){}releaseDescription(){}shouldCompleteOpen(){}init(){}initOverlay(){}abort(){var e;this.releaseDescription(),(e=this.abortController)==null||e.abort()}hostConnected(){this.init()}hostDisconnected(){this.isPersistent||this.abort()}}
|
|
2
2
|
//# sourceMappingURL=InteractionController.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["InteractionController.ts"],
|
|
4
|
-
"sourcesContent": ["/*\nCopyright 2024 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*/\n\nimport type { ReactiveController } from '
|
|
5
|
-
"mappings": "aAeO,WAAK,kBAAAA,IACRA,IAAA,iBACAA,IAAA,iBACAA,IAAA,yBAHQA,IAAA,sBAYL,aAAM,qBAAoD,
|
|
4
|
+
"sourcesContent": ["/*\nCopyright 2024 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*/\n\nimport type { ReactiveController } from '@spectrum-web-components/base';\nimport { AbstractOverlay } from './AbstractOverlay.js';\n\nexport enum InteractionTypes {\n 'click',\n 'hover',\n 'longpress',\n}\n\nexport type ControllerOptions = {\n overlay?: AbstractOverlay;\n handleOverlayReady?: (overlay: AbstractOverlay) => void;\n isPersistent?: boolean;\n};\n\nexport class InteractionController implements ReactiveController {\n abortController!: AbortController;\n\n get activelyOpening(): boolean {\n return false;\n }\n\n private handleOverlayReady?: (overlay: AbstractOverlay) => void;\n\n // Holds optimistic open state when an Overlay is not yet present\n private isLazilyOpen = false;\n\n public get open(): boolean {\n return this.overlay?.open ?? this.isLazilyOpen;\n }\n\n /**\n * Set `open` against the associated Overlay lazily.\n */\n public set open(open: boolean) {\n if (open === this.open) return;\n this.isLazilyOpen = open;\n if (this.overlay) {\n // If there already is an Overlay, apply the value of `open` directly.\n this.overlay.open = open;\n return;\n }\n if (!open) {\n // When `open` moves to `false` and there is not yet an Overlay,\n // assume that no Overlay and a closed Overlay are the same and return early.\n return;\n }\n // When there is no Overlay and `open` is moving to `true`, lazily import/create\n // an Overlay and apply that state to it.\n customElements\n .whenDefined('sp-overlay')\n .then(async (): Promise<void> => {\n const { Overlay } = await import('./Overlay.js');\n this.overlay = new Overlay();\n this.overlay.open = true;\n });\n import('@spectrum-web-components/overlay/sp-overlay.js');\n }\n\n public get overlay(): AbstractOverlay {\n return this._overlay;\n }\n\n public set overlay(overlay: AbstractOverlay | undefined) {\n if (!overlay) return;\n if (this.overlay === overlay) return;\n if (this.overlay) {\n this.overlay.removeController(this);\n }\n this._overlay = overlay;\n this.overlay.addController(this);\n this.initOverlay();\n this.prepareDescription(this.target);\n this.handleOverlayReady?.(this.overlay);\n }\n\n private _overlay!: AbstractOverlay;\n\n protected isPersistent = false;\n\n type!: InteractionTypes;\n\n constructor(\n public target: HTMLElement,\n { overlay, isPersistent, handleOverlayReady }: ControllerOptions\n ) {\n this.isPersistent = !!isPersistent;\n this.handleOverlayReady = handleOverlayReady;\n if (this.isPersistent) {\n this.init();\n }\n this.overlay = overlay;\n }\n\n prepareDescription(_: HTMLElement): void {}\n\n releaseDescription(): void {}\n\n shouldCompleteOpen(): void {}\n\n /* c8 ignore next 3 */\n init(): void {\n // Abstract init() method.\n }\n\n /* c8 ignore next 3 */\n initOverlay(): void {\n // Abstract initOverlay() method.\n }\n\n abort(): void {\n this.releaseDescription();\n this.abortController?.abort();\n }\n\n hostConnected(): void {\n this.init();\n }\n\n hostDisconnected(): void {\n if (!this.isPersistent) {\n this.abort();\n }\n }\n}\n"],
|
|
5
|
+
"mappings": "aAeO,WAAK,kBAAAA,IACRA,IAAA,iBACAA,IAAA,iBACAA,IAAA,yBAHQA,IAAA,sBAYL,aAAM,qBAAoD,CAmE7D,YACWC,EACP,CAAE,QAAAC,EAAS,aAAAC,EAAc,mBAAAC,CAAmB,EAC9C,CAFS,YAAAH,EA1DX,KAAQ,aAAe,GAqDvB,KAAU,aAAe,GAQrB,KAAK,aAAe,CAAC,CAACE,EACtB,KAAK,mBAAqBC,EACtB,KAAK,cACL,KAAK,KAAK,EAEd,KAAK,QAAUF,CACnB,CA1EA,IAAI,iBAA2B,CAC3B,MAAO,EACX,CAOA,IAAW,MAAgB,CAvC/B,IAAAG,EAAAC,EAwCQ,OAAOA,GAAAD,EAAA,KAAK,UAAL,YAAAA,EAAc,OAAd,KAAAC,EAAsB,KAAK,YACtC,CAKA,IAAW,KAAKC,EAAe,CAC3B,GAAIA,IAAS,KAAK,KAElB,IADA,KAAK,aAAeA,EAChB,KAAK,QAAS,CAEd,KAAK,QAAQ,KAAOA,EACpB,MACJ,CACKA,IAOL,eACK,YAAY,YAAY,EACxB,KAAK,SAA2B,CAC7B,KAAM,CAAE,QAAAC,CAAQ,EAAI,KAAM,QAAO,cAAc,EAC/C,KAAK,QAAU,IAAIA,EACnB,KAAK,QAAQ,KAAO,EACxB,CAAC,EACL,OAAO,gDAAgD,GAC3D,CAEA,IAAW,SAA2B,CAClC,OAAO,KAAK,QAChB,CAEA,IAAW,QAAQN,EAAsC,CA3E7D,IAAAG,EA4EaH,GACD,KAAK,UAAYA,IACjB,KAAK,SACL,KAAK,QAAQ,iBAAiB,IAAI,EAEtC,KAAK,SAAWA,EAChB,KAAK,QAAQ,cAAc,IAAI,EAC/B,KAAK,YAAY,EACjB,KAAK,mBAAmB,KAAK,MAAM,GACnCG,EAAA,KAAK,qBAAL,MAAAA,EAAA,UAA0B,KAAK,SACnC,CAoBA,mBAAmBI,EAAsB,CAAC,CAE1C,oBAA2B,CAAC,CAE5B,oBAA2B,CAAC,CAG5B,MAAa,CAEb,CAGA,aAAoB,CAEpB,CAEA,OAAc,CA1HlB,IAAAJ,EA2HQ,KAAK,mBAAmB,GACxBA,EAAA,KAAK,kBAAL,MAAAA,EAAsB,OAC1B,CAEA,eAAsB,CAClB,KAAK,KAAK,CACd,CAEA,kBAAyB,CAChB,KAAK,cACN,KAAK,MAAM,CAEnB,CACJ",
|
|
6
6
|
"names": ["InteractionTypes", "target", "overlay", "isPersistent", "handleOverlayReady", "_a", "_b", "open", "Overlay", "_"]
|
|
7
7
|
}
|
|
@@ -25,8 +25,7 @@ export class LongpressController extends InteractionController {
|
|
|
25
25
|
this.handlePointerup = () => {
|
|
26
26
|
var _a;
|
|
27
27
|
clearTimeout(this.timeout);
|
|
28
|
-
if (!this.target)
|
|
29
|
-
return;
|
|
28
|
+
if (!this.target) return;
|
|
30
29
|
this.longpressState = ((_a = this.overlay) == null ? void 0 : _a.state) === "opening" ? "pressed" : null;
|
|
31
30
|
document.removeEventListener("pointerup", this.handlePointerup);
|
|
32
31
|
document.removeEventListener("pointercancel", this.handlePointerup);
|
|
@@ -40,19 +39,15 @@ export class LongpressController extends InteractionController {
|
|
|
40
39
|
this.longpressState = this.longpressState === "potential" ? "opening" : "pressed";
|
|
41
40
|
}
|
|
42
41
|
handlePointerdown(event) {
|
|
43
|
-
if (!this.target)
|
|
44
|
-
|
|
45
|
-
if (event.button !== 0)
|
|
46
|
-
return;
|
|
42
|
+
if (!this.target) return;
|
|
43
|
+
if (event.button !== 0) return;
|
|
47
44
|
this.longpressState = "potential";
|
|
48
45
|
document.addEventListener("pointerup", this.handlePointerup);
|
|
49
46
|
document.addEventListener("pointercancel", this.handlePointerup);
|
|
50
47
|
const triggerHandlesLongpress = "holdAffordance" in this.target;
|
|
51
|
-
if (triggerHandlesLongpress)
|
|
52
|
-
return;
|
|
48
|
+
if (triggerHandlesLongpress) return;
|
|
53
49
|
this.timeout = setTimeout(() => {
|
|
54
|
-
if (!this.target)
|
|
55
|
-
return;
|
|
50
|
+
if (!this.target) return;
|
|
56
51
|
this.target.dispatchEvent(
|
|
57
52
|
new CustomEvent("longpress", {
|
|
58
53
|
bubbles: true,
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["LongpressController.ts"],
|
|
4
4
|
"sourcesContent": ["/*\nCopyright 2024 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*/\n\nimport {\n isAndroid,\n isIOS,\n} from '@spectrum-web-components/shared/src/platform.js';\nimport { conditionAttributeWithId } from '@spectrum-web-components/base/src/condition-attribute-with-id.js';\nimport { randomID } from '@spectrum-web-components/shared/src/random-id.js';\n\nimport { noop } from './AbstractOverlay.dev.js'\nimport {\n InteractionController,\n InteractionTypes,\n} from './InteractionController.dev.js'\n\nconst LONGPRESS_DURATION = 300;\nexport const LONGPRESS_INSTRUCTIONS = {\n touch: 'Double tap and long press for additional options',\n keyboard: 'Press Space or Alt+Down Arrow for additional options',\n mouse: 'Click and hold for additional options',\n};\n\ntype LongpressEvent = {\n source: 'pointer' | 'keyboard';\n};\n\nexport class LongpressController extends InteractionController {\n override type = InteractionTypes.longpress;\n\n override get activelyOpening(): boolean {\n return (\n this.longpressState === 'opening' ||\n this.longpressState === 'pressed'\n );\n }\n\n protected longpressState: null | 'potential' | 'opening' | 'pressed' = null;\n\n override releaseDescription = noop;\n\n private timeout!: ReturnType<typeof setTimeout>;\n\n handleLongpress(): void {\n this.open = true;\n this.longpressState =\n this.longpressState === 'potential' ? 'opening' : 'pressed';\n }\n\n handlePointerdown(event: PointerEvent): void {\n if (!this.target) return;\n if (event.button !== 0) return;\n this.longpressState = 'potential';\n document.addEventListener('pointerup', this.handlePointerup);\n document.addEventListener('pointercancel', this.handlePointerup);\n // Only dispatch longpress event if the trigger element isn't doing it for us.\n const triggerHandlesLongpress = 'holdAffordance' in this.target;\n if (triggerHandlesLongpress) return;\n this.timeout = setTimeout(() => {\n if (!this.target) return;\n this.target.dispatchEvent(\n new CustomEvent<LongpressEvent>('longpress', {\n bubbles: true,\n composed: true,\n detail: {\n source: 'pointer',\n },\n })\n );\n }, LONGPRESS_DURATION);\n }\n\n private handlePointerup = (): void => {\n clearTimeout(this.timeout);\n if (!this.target) return;\n // When triggered by the pointer, the last of `opened`\n // or `pointerup` should move the `longpressState` to\n // `null` so that the earlier event can void the \"light\n // dismiss\" and keep the Overlay open.\n this.longpressState =\n this.overlay?.state === 'opening' ? 'pressed' : null;\n document.removeEventListener('pointerup', this.handlePointerup);\n document.removeEventListener('pointercancel', this.handlePointerup);\n };\n\n private handleKeydown(event: KeyboardEvent): void {\n const { code, altKey } = event;\n if (altKey && code === 'ArrowDown') {\n event.stopPropagation();\n event.stopImmediatePropagation();\n }\n }\n\n private handleKeyup(event: KeyboardEvent): void {\n const { code, altKey } = event;\n if (code === 'Space' || (altKey && code === 'ArrowDown')) {\n if (!this.target) {\n return;\n }\n event.stopPropagation();\n this.target.dispatchEvent(\n new CustomEvent<LongpressEvent>('longpress', {\n bubbles: true,\n composed: true,\n detail: {\n source: 'keyboard',\n },\n })\n );\n setTimeout(() => {\n this.longpressState = null;\n });\n }\n }\n\n override prepareDescription(trigger: HTMLElement): void {\n if (\n // do not reapply until target is recycled\n this.releaseDescription !== noop ||\n // require \"longpress content\" to apply relationship\n !this.overlay.elements.length\n ) {\n return;\n }\n\n const longpressDescription = document.createElement('div');\n longpressDescription.id = `longpress-describedby-descriptor-${randomID()}`;\n const messageType = isIOS() || isAndroid() ? 'touch' : 'keyboard';\n longpressDescription.textContent = LONGPRESS_INSTRUCTIONS[messageType];\n longpressDescription.slot = 'longpress-describedby-descriptor';\n const triggerParent = trigger.getRootNode() as HTMLElement;\n const overlayParent = this.overlay.getRootNode() as HTMLElement;\n // Manage the placement of the helper element in an accessible place with\n // the lowest chance of negatively affecting the layout of the page.\n if (triggerParent === overlayParent) {\n // Trigger and Overlay in same DOM tree...\n // Append helper element to Overlay.\n this.overlay.append(longpressDescription);\n } else {\n // If Trigger in <body>, hide helper\n longpressDescription.hidden = !('host' in triggerParent);\n // Trigger and Overlay in different DOM tree, Trigger in shadow tree...\n // Insert helper element after Trigger.\n trigger.insertAdjacentElement('afterend', longpressDescription);\n }\n\n const releaseDescription = conditionAttributeWithId(\n trigger,\n 'aria-describedby',\n [longpressDescription.id]\n );\n this.releaseDescription = () => {\n releaseDescription();\n longpressDescription.remove();\n this.releaseDescription = noop;\n };\n }\n\n override shouldCompleteOpen(): void {\n // When triggered by the pointer, the last of `opened`\n // or `pointerup` should move the `longpressState` to\n // `null` so that the earlier event can void the \"light\n // dismiss\" and keep the Overlay open.\n this.longpressState =\n this.longpressState === 'pressed' ? null : this.longpressState;\n }\n\n override init(): void {\n // Clean up listeners if they've already been bound\n this.abortController?.abort();\n this.abortController = new AbortController();\n const { signal } = this.abortController;\n this.target.addEventListener(\n 'longpress',\n () => this.handleLongpress(),\n { signal }\n );\n this.target.addEventListener(\n 'pointerdown',\n (event: PointerEvent) => this.handlePointerdown(event),\n { signal }\n );\n\n this.prepareDescription(this.target);\n if (\n (this.target as HTMLElement & { holdAffordance: boolean })\n .holdAffordance\n ) {\n // Only bind keyboard events when the trigger element isn't doing it for us.\n return;\n }\n this.target.addEventListener(\n 'keydown',\n (event: KeyboardEvent) => this.handleKeydown(event),\n { signal }\n );\n this.target.addEventListener(\n 'keyup',\n (event: KeyboardEvent) => this.handleKeyup(event),\n { signal }\n );\n }\n}\n"],
|
|
5
|
-
"mappings": ";AAYA;AAAA,EACI;AAAA,EACA;AAAA,OACG;AACP,SAAS,gCAAgC;AACzC,SAAS,gBAAgB;AAEzB,SAAS,YAAY;AACrB;AAAA,EACI;AAAA,EACA;AAAA,OACG;AAEP,MAAM,qBAAqB;AACpB,aAAM,yBAAyB;AAAA,EAClC,OAAO;AAAA,EACP,UAAU;AAAA,EACV,OAAO;AACX;AAMO,aAAM,4BAA4B,sBAAsB;AAAA,EAAxD;AAAA;AACH,SAAS,OAAO,iBAAiB;AASjC,SAAU,iBAA6D;AAEvE,SAAS,qBAAqB;AAiC9B,SAAQ,kBAAkB,MAAY;AAjF1C;AAkFQ,mBAAa,KAAK,OAAO;AACzB,UAAI,CAAC,KAAK;
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/src/Overlay.dev.js
CHANGED
|
@@ -6,8 +6,7 @@ var __decorateClass = (decorators, target, key, kind) => {
|
|
|
6
6
|
for (var i = decorators.length - 1, decorator; i >= 0; i--)
|
|
7
7
|
if (decorator = decorators[i])
|
|
8
8
|
result = (kind ? decorator(target, key, result) : decorator(result)) || result;
|
|
9
|
-
if (kind && result)
|
|
10
|
-
__defProp(target, key, result);
|
|
9
|
+
if (kind && result) __defProp(target, key, result);
|
|
11
10
|
return result;
|
|
12
11
|
};
|
|
13
12
|
import {
|
|
@@ -122,12 +121,9 @@ const _Overlay = class _Overlay extends OverlayFeatures {
|
|
|
122
121
|
}
|
|
123
122
|
set open(open) {
|
|
124
123
|
var _a;
|
|
125
|
-
if (open && this.disabled)
|
|
126
|
-
|
|
127
|
-
if (
|
|
128
|
-
return;
|
|
129
|
-
if (((_a = this.strategy) == null ? void 0 : _a.activelyOpening) && !open)
|
|
130
|
-
return;
|
|
124
|
+
if (open && this.disabled) return;
|
|
125
|
+
if (open === this.open) return;
|
|
126
|
+
if (((_a = this.strategy) == null ? void 0 : _a.activelyOpening) && !open) return;
|
|
131
127
|
this._open = open;
|
|
132
128
|
if (this.open) {
|
|
133
129
|
_Overlay.openCount += 1;
|
|
@@ -142,8 +138,7 @@ const _Overlay = class _Overlay extends OverlayFeatures {
|
|
|
142
138
|
}
|
|
143
139
|
set state(state2) {
|
|
144
140
|
var _a;
|
|
145
|
-
if (state2 === this.state)
|
|
146
|
-
return;
|
|
141
|
+
if (state2 === this.state) return;
|
|
147
142
|
const oldState = this.state;
|
|
148
143
|
this._state = state2;
|
|
149
144
|
if (this.state === "opened" || this.state === "closed") {
|
|
@@ -176,15 +171,13 @@ const _Overlay = class _Overlay extends OverlayFeatures {
|
|
|
176
171
|
}
|
|
177
172
|
}
|
|
178
173
|
get requiresPosition() {
|
|
179
|
-
if (this.type === "page" || !this.open)
|
|
180
|
-
return false;
|
|
174
|
+
if (this.type === "page" || !this.open) return false;
|
|
181
175
|
if (!this.triggerElement || !this.placement && this.type !== "hint")
|
|
182
176
|
return false;
|
|
183
177
|
return true;
|
|
184
178
|
}
|
|
185
179
|
managePosition() {
|
|
186
|
-
if (!this.requiresPosition || !this.open)
|
|
187
|
-
return;
|
|
180
|
+
if (!this.requiresPosition || !this.open) return;
|
|
188
181
|
const offset = this.offset || 0;
|
|
189
182
|
const trigger = this.triggerElement;
|
|
190
183
|
const placement = this.placement || "right";
|
|
@@ -233,8 +226,7 @@ const _Overlay = class _Overlay extends OverlayFeatures {
|
|
|
233
226
|
}
|
|
234
227
|
returnFocus() {
|
|
235
228
|
var _a;
|
|
236
|
-
if (this.open || this.type === "hint")
|
|
237
|
-
return;
|
|
229
|
+
if (this.open || this.type === "hint") return;
|
|
238
230
|
const getAncestors = () => {
|
|
239
231
|
var _a2, _b;
|
|
240
232
|
const ancestors = [];
|
|
@@ -251,14 +243,13 @@ const _Overlay = class _Overlay extends OverlayFeatures {
|
|
|
251
243
|
}
|
|
252
244
|
return ancestors;
|
|
253
245
|
};
|
|
254
|
-
if (this.receivesFocus !== "false" && ((_a = this.triggerElement) == null ? void 0 : _a.focus) && (this.contains(this.getRootNode().activeElement) || getAncestors().includes(this) || // eslint-disable-next-line @spectrum-web-components/document-active-element
|
|
246
|
+
if (this.receivesFocus !== "false" && !!((_a = this.triggerElement) == null ? void 0 : _a.focus) && (this.contains(this.getRootNode().activeElement) || getAncestors().includes(this) || // eslint-disable-next-line @spectrum-web-components/document-active-element
|
|
255
247
|
document.activeElement === document.body)) {
|
|
256
248
|
this.triggerElement.focus();
|
|
257
249
|
}
|
|
258
250
|
}
|
|
259
251
|
async manageOpen(oldOpen) {
|
|
260
|
-
if (!this.isConnected && this.open)
|
|
261
|
-
return;
|
|
252
|
+
if (!this.isConnected && this.open) return;
|
|
262
253
|
if (!this.hasUpdated) {
|
|
263
254
|
await this.updateComplete;
|
|
264
255
|
}
|
|
@@ -318,10 +309,8 @@ const _Overlay = class _Overlay extends OverlayFeatures {
|
|
|
318
309
|
var _a;
|
|
319
310
|
(_a = this.strategy) == null ? void 0 : _a.abort();
|
|
320
311
|
this.strategy = void 0;
|
|
321
|
-
if (!this.hasNonVirtualTrigger)
|
|
322
|
-
|
|
323
|
-
if (!this.triggerInteraction)
|
|
324
|
-
return;
|
|
312
|
+
if (!this.hasNonVirtualTrigger) return;
|
|
313
|
+
if (!this.triggerInteraction) return;
|
|
325
314
|
this.strategy = new strategies[this.triggerInteraction](
|
|
326
315
|
this.triggerElement,
|
|
327
316
|
{
|