@blogmcp/mdx-render-vue 0.1.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/dist/_virtual/_plugin-vue_export-helper.js +10 -0
- package/dist/_virtual/constants.js +4 -0
- package/dist/_virtual/index.js +5 -0
- package/dist/_virtual/index2.js +4 -0
- package/dist/composables/index.d.ts +11 -0
- package/dist/composables/index.js +24 -0
- package/dist/composables/useAudioPlayer.d.ts +22 -0
- package/dist/composables/useAudioPlayer.js +58 -0
- package/dist/composables/useCallout.d.ts +43 -0
- package/dist/composables/useCallout.js +71 -0
- package/dist/composables/useCodeBlock.d.ts +23 -0
- package/dist/composables/useCodeBlock.js +67 -0
- package/dist/composables/useGallery.d.ts +37 -0
- package/dist/composables/useGallery.js +84 -0
- package/dist/composables/useMedia.d.ts +18 -0
- package/dist/composables/useMedia.js +9 -0
- package/dist/composables/useYouTube.d.ts +31 -0
- package/dist/composables/useYouTube.js +32 -0
- package/dist/edit/AlertEdit.vue.d.ts +12 -0
- package/dist/edit/AlertEdit.vue.js +4 -0
- package/dist/edit/AlertEdit.vue2.js +18 -0
- package/dist/edit/AudioPlayerEdit.vue.d.ts +3 -0
- package/dist/edit/AudioPlayerEdit.vue.js +117 -0
- package/dist/edit/AudioPlayerEdit.vue2.js +4 -0
- package/dist/edit/BadgeEdit.vue.d.ts +2 -0
- package/dist/edit/BadgeEdit.vue.js +4 -0
- package/dist/edit/BadgeEdit.vue2.js +13 -0
- package/dist/edit/ButtonEdit.vue.d.ts +2 -0
- package/dist/edit/ButtonEdit.vue.js +4 -0
- package/dist/edit/ButtonEdit.vue2.js +13 -0
- package/dist/edit/CalloutEdit.vue.d.ts +13 -0
- package/dist/edit/CalloutEdit.vue.js +85 -0
- package/dist/edit/CalloutEdit.vue2.js +4 -0
- package/dist/edit/CardEdit.vue.d.ts +12 -0
- package/dist/edit/CardEdit.vue.js +4 -0
- package/dist/edit/CardEdit.vue2.js +18 -0
- package/dist/edit/CodeBlockEdit.vue.d.ts +12 -0
- package/dist/edit/CodeBlockEdit.vue.js +7 -0
- package/dist/edit/CodeBlockEdit.vue2.js +89 -0
- package/dist/edit/GalleryEdit.vue.d.ts +3 -0
- package/dist/edit/GalleryEdit.vue.js +64 -0
- package/dist/edit/GalleryEdit.vue2.js +4 -0
- package/dist/edit/IconEdit.vue.d.ts +2 -0
- package/dist/edit/IconEdit.vue.js +4 -0
- package/dist/edit/IconEdit.vue2.js +13 -0
- package/dist/edit/TooltipEdit.vue.d.ts +16 -0
- package/dist/edit/TooltipEdit.vue.js +4 -0
- package/dist/edit/TooltipEdit.vue2.js +24 -0
- package/dist/edit/YouTubeEdit.vue.d.ts +3 -0
- package/dist/edit/YouTubeEdit.vue.js +41 -0
- package/dist/edit/YouTubeEdit.vue2.js +4 -0
- package/dist/edit/index.d.ts +29 -0
- package/dist/edit/index.js +35 -0
- package/dist/index.d.ts +12 -0
- package/dist/index.js +75 -0
- package/dist/mdx-render-vue.css +31 -0
- package/dist/node_modules/@ark-ui/vue/dist/_virtual/_rolldown/runtime.js +13 -0
- package/dist/node_modules/@ark-ui/vue/dist/components/factory.js +35 -0
- package/dist/node_modules/@ark-ui/vue/dist/components/presence/use-presence-context.js +6 -0
- package/dist/node_modules/@ark-ui/vue/dist/components/presence/use-presence.js +40 -0
- package/dist/node_modules/@ark-ui/vue/dist/components/tooltip/tooltip-arrow-tip.js +5 -0
- package/dist/node_modules/@ark-ui/vue/dist/components/tooltip/tooltip-arrow-tip.vue_vue_type_script_setup_true_lang.js +21 -0
- package/dist/node_modules/@ark-ui/vue/dist/components/tooltip/tooltip-arrow.js +5 -0
- package/dist/node_modules/@ark-ui/vue/dist/components/tooltip/tooltip-arrow.vue_vue_type_script_setup_true_lang.js +21 -0
- package/dist/node_modules/@ark-ui/vue/dist/components/tooltip/tooltip-content.js +5 -0
- package/dist/node_modules/@ark-ui/vue/dist/components/tooltip/tooltip-content.vue_vue_type_script_setup_true_lang.js +25 -0
- package/dist/node_modules/@ark-ui/vue/dist/components/tooltip/tooltip-context.js +5 -0
- package/dist/node_modules/@ark-ui/vue/dist/components/tooltip/tooltip-context.vue_vue_type_script_setup_true_lang.js +14 -0
- package/dist/node_modules/@ark-ui/vue/dist/components/tooltip/tooltip-positioner.js +5 -0
- package/dist/node_modules/@ark-ui/vue/dist/components/tooltip/tooltip-positioner.vue_vue_type_script_setup_true_lang.js +23 -0
- package/dist/node_modules/@ark-ui/vue/dist/components/tooltip/tooltip-root-provider.js +5 -0
- package/dist/node_modules/@ark-ui/vue/dist/components/tooltip/tooltip-root-provider.vue_vue_type_script_setup_true_lang.js +38 -0
- package/dist/node_modules/@ark-ui/vue/dist/components/tooltip/tooltip-root.js +5 -0
- package/dist/node_modules/@ark-ui/vue/dist/components/tooltip/tooltip-root.vue_vue_type_script_setup_true_lang.js +68 -0
- package/dist/node_modules/@ark-ui/vue/dist/components/tooltip/tooltip-trigger.js +5 -0
- package/dist/node_modules/@ark-ui/vue/dist/components/tooltip/tooltip-trigger.vue_vue_type_script_setup_true_lang.js +25 -0
- package/dist/node_modules/@ark-ui/vue/dist/components/tooltip/tooltip.js +22 -0
- package/dist/node_modules/@ark-ui/vue/dist/components/tooltip/use-tooltip-context.js +6 -0
- package/dist/node_modules/@ark-ui/vue/dist/components/tooltip/use-tooltip.js +36 -0
- package/dist/node_modules/@ark-ui/vue/dist/providers/environment/use-environment-context.js +13 -0
- package/dist/node_modules/@ark-ui/vue/dist/providers/locale/use-locale-context.js +12 -0
- package/dist/node_modules/@ark-ui/vue/dist/utils/clean-props.js +8 -0
- package/dist/node_modules/@ark-ui/vue/dist/utils/create-context.js +14 -0
- package/dist/node_modules/@ark-ui/vue/dist/utils/dynamic.js +34 -0
- package/dist/node_modules/@ark-ui/vue/dist/utils/unref-element.js +8 -0
- package/dist/node_modules/@ark-ui/vue/dist/utils/use-forward-expose.js +46 -0
- package/dist/node_modules/@ark-ui/vue/dist/utils/use-render-strategy.js +5 -0
- package/dist/node_modules/@braintree/sanitize-url/dist/constants.js +20 -0
- package/dist/node_modules/@braintree/sanitize-url/dist/index.js +75 -0
- package/dist/node_modules/@floating-ui/core/dist/floating-ui.core.js +728 -0
- package/dist/node_modules/@floating-ui/dom/dist/floating-ui.dom.js +629 -0
- package/dist/node_modules/@floating-ui/utils/dist/floating-ui.utils.dom.js +176 -0
- package/dist/node_modules/@floating-ui/utils/dist/floating-ui.utils.js +151 -0
- package/dist/node_modules/@iconify/vue/dist/iconify.js +1691 -0
- package/dist/node_modules/@zag-js/anatomy/dist/create-anatomy.js +29 -0
- package/dist/node_modules/@zag-js/core/dist/create-machine.js +28 -0
- package/dist/node_modules/@zag-js/core/dist/merge-props.js +55 -0
- package/dist/node_modules/@zag-js/core/dist/scope.js +20 -0
- package/dist/node_modules/@zag-js/core/dist/state.js +176 -0
- package/dist/node_modules/@zag-js/core/dist/types.js +11 -0
- package/dist/node_modules/@zag-js/dom-query/dist/chunk-QZ7TP4HQ.js +6 -0
- package/dist/node_modules/@zag-js/dom-query/dist/computed-style.js +11 -0
- package/dist/node_modules/@zag-js/dom-query/dist/event.js +37 -0
- package/dist/node_modules/@zag-js/dom-query/dist/node.js +64 -0
- package/dist/node_modules/@zag-js/dom-query/dist/overflow.js +28 -0
- package/dist/node_modules/@zag-js/dom-query/dist/platform.js +23 -0
- package/dist/node_modules/@zag-js/dom-query/dist/query.js +6 -0
- package/dist/node_modules/@zag-js/dom-query/dist/raf.js +52 -0
- package/dist/node_modules/@zag-js/dom-query/dist/set.js +22 -0
- package/dist/node_modules/@zag-js/dom-query/dist/shared.js +8 -0
- package/dist/node_modules/@zag-js/focus-visible/dist/index.js +159 -0
- package/dist/node_modules/@zag-js/popper/dist/get-anchor.js +39 -0
- package/dist/node_modules/@zag-js/popper/dist/get-placement.js +296 -0
- package/dist/node_modules/@zag-js/popper/dist/get-styles.js +47 -0
- package/dist/node_modules/@zag-js/popper/dist/middleware.js +79 -0
- package/dist/node_modules/@zag-js/popper/dist/placement.js +7 -0
- package/dist/node_modules/@zag-js/presence/dist/presence.connect.js +18 -0
- package/dist/node_modules/@zag-js/presence/dist/presence.machine.js +175 -0
- package/dist/node_modules/@zag-js/tooltip/dist/tooltip.anatomy.js +7 -0
- package/dist/node_modules/@zag-js/tooltip/dist/tooltip.connect.js +155 -0
- package/dist/node_modules/@zag-js/tooltip/dist/tooltip.dom.js +24 -0
- package/dist/node_modules/@zag-js/tooltip/dist/tooltip.machine.js +416 -0
- package/dist/node_modules/@zag-js/tooltip/dist/tooltip.store.js +9 -0
- package/dist/node_modules/@zag-js/types/dist/prop-types.js +14 -0
- package/dist/node_modules/@zag-js/utils/dist/array.js +7 -0
- package/dist/node_modules/@zag-js/utils/dist/equal.js +36 -0
- package/dist/node_modules/@zag-js/utils/dist/functions.js +11 -0
- package/dist/node_modules/@zag-js/utils/dist/guard.js +26 -0
- package/dist/node_modules/@zag-js/utils/dist/object.js +16 -0
- package/dist/node_modules/@zag-js/utils/dist/store.js +44 -0
- package/dist/node_modules/@zag-js/utils/dist/warning.js +31 -0
- package/dist/node_modules/@zag-js/vue/dist/bindable.js +48 -0
- package/dist/node_modules/@zag-js/vue/dist/machine.js +258 -0
- package/dist/node_modules/@zag-js/vue/dist/normalize-props.js +42 -0
- package/dist/node_modules/@zag-js/vue/dist/refs.js +14 -0
- package/dist/node_modules/@zag-js/vue/dist/track.js +22 -0
- package/dist/node_modules/dompurify/dist/purify.es.js +1190 -0
- package/dist/registry.d.ts +76 -0
- package/dist/registry.js +164 -0
- package/dist/render/alert/Alert.vue.d.ts +18 -0
- package/dist/render/alert/Alert.vue.js +4 -0
- package/dist/render/alert/Alert.vue2.js +43 -0
- package/dist/render/alert/index.d.ts +2 -0
- package/dist/render/audioplayer/AudioPlayerDefault.vue.d.ts +3 -0
- package/dist/render/audioplayer/AudioPlayerDefault.vue.js +116 -0
- package/dist/render/audioplayer/AudioPlayerDefault.vue2.js +4 -0
- package/dist/render/audioplayer/index.d.ts +5 -0
- package/dist/render/audioplayer/index.js +5 -0
- package/dist/render/badge/Badge.vue.d.ts +10 -0
- package/dist/render/badge/Badge.vue.js +4 -0
- package/dist/render/badge/Badge.vue2.js +28 -0
- package/dist/render/badge/index.d.ts +2 -0
- package/dist/render/button/Button.vue.d.ts +13 -0
- package/dist/render/button/Button.vue.js +4 -0
- package/dist/render/button/Button.vue2.js +42 -0
- package/dist/render/button/index.d.ts +2 -0
- package/dist/render/callout/CalloutDefault.vue.d.ts +13 -0
- package/dist/render/callout/CalloutDefault.vue.js +86 -0
- package/dist/render/callout/CalloutDefault.vue2.js +4 -0
- package/dist/render/callout/CalloutMinimal.vue.d.ts +13 -0
- package/dist/render/callout/CalloutMinimal.vue.js +27 -0
- package/dist/render/callout/CalloutMinimal.vue2.js +4 -0
- package/dist/render/callout/index.d.ts +6 -0
- package/dist/render/callout/index.js +7 -0
- package/dist/render/card/Card.vue.d.ts +15 -0
- package/dist/render/card/Card.vue.js +4 -0
- package/dist/render/card/Card.vue2.js +29 -0
- package/dist/render/card/index.d.ts +2 -0
- package/dist/render/codeblock/CodeBlockDefault.vue.d.ts +12 -0
- package/dist/render/codeblock/CodeBlockDefault.vue.js +7 -0
- package/dist/render/codeblock/CodeBlockDefault.vue2.js +92 -0
- package/dist/render/codeblock/index.d.ts +5 -0
- package/dist/render/codeblock/index.js +5 -0
- package/dist/render/gallery/GalleryGrid.vue.d.ts +3 -0
- package/dist/render/gallery/GalleryGrid.vue.js +125 -0
- package/dist/render/gallery/GalleryGrid.vue2.js +4 -0
- package/dist/render/gallery/GalleryLightbox.vue.d.ts +16 -0
- package/dist/render/gallery/GalleryLightbox.vue.js +7 -0
- package/dist/render/gallery/GalleryLightbox.vue2.js +170 -0
- package/dist/render/gallery/index.d.ts +6 -0
- package/dist/render/gallery/index.js +7 -0
- package/dist/render/icon/Icon.vue.d.ts +9 -0
- package/dist/render/icon/Icon.vue.js +4 -0
- package/dist/render/icon/Icon.vue2.js +25 -0
- package/dist/render/icon/index.d.ts +2 -0
- package/dist/render/index.d.ts +40 -0
- package/dist/render/index.js +63 -0
- package/dist/render/tooltip/Tooltip.vue.d.ts +18 -0
- package/dist/render/tooltip/Tooltip.vue.js +4 -0
- package/dist/render/tooltip/Tooltip.vue2.js +58 -0
- package/dist/render/tooltip/index.d.ts +2 -0
- package/dist/render/youtube/YouTubeDefault.vue.d.ts +3 -0
- package/dist/render/youtube/YouTubeDefault.vue.js +79 -0
- package/dist/render/youtube/YouTubeDefault.vue2.js +4 -0
- package/dist/render/youtube/index.d.ts +5 -0
- package/dist/render/youtube/index.js +5 -0
- package/dist/useAudioPlayer.d.ts +22 -0
- package/dist/useCallout.d.ts +46 -0
- package/dist/useCodeBlock.d.ts +25 -0
- package/dist/useGallery.d.ts +44 -0
- package/dist/useMedia.d.ts +16 -0
- package/dist/useYouTube.d.ts +32 -0
- package/package.json +125 -0
- package/src/composables/index.ts +16 -0
- package/src/composables/useAudioPlayer.ts +84 -0
- package/src/composables/useCallout.ts +103 -0
- package/src/composables/useCodeBlock.ts +90 -0
- package/src/composables/useGallery.ts +143 -0
- package/src/composables/useMedia.ts +23 -0
- package/src/composables/useYouTube.ts +58 -0
- package/src/edit/AlertEdit.vue +9 -0
- package/src/edit/AudioPlayerEdit.vue +92 -0
- package/src/edit/BadgeEdit.vue +7 -0
- package/src/edit/ButtonEdit.vue +10 -0
- package/src/edit/CalloutEdit.vue +107 -0
- package/src/edit/CardEdit.vue +9 -0
- package/src/edit/CodeBlockEdit.vue +76 -0
- package/src/edit/GalleryEdit.vue +65 -0
- package/src/edit/IconEdit.vue +7 -0
- package/src/edit/TooltipEdit.vue +15 -0
- package/src/edit/YouTubeEdit.vue +33 -0
- package/src/edit/index.ts +32 -0
- package/src/index.ts +62 -0
- package/src/registry.ts +272 -0
- package/src/render/alert/Alert.vue +32 -0
- package/src/render/alert/index.ts +2 -0
- package/src/render/audioplayer/AudioPlayerDefault.vue +89 -0
- package/src/render/audioplayer/index.ts +8 -0
- package/src/render/badge/Badge.vue +25 -0
- package/src/render/badge/index.ts +2 -0
- package/src/render/button/Button.vue +41 -0
- package/src/render/button/index.ts +2 -0
- package/src/render/callout/CalloutDefault.vue +101 -0
- package/src/render/callout/CalloutMinimal.vue +31 -0
- package/src/render/callout/index.ts +9 -0
- package/src/render/card/Card.vue +15 -0
- package/src/render/card/index.ts +2 -0
- package/src/render/codeblock/CodeBlockDefault.vue +76 -0
- package/src/render/codeblock/index.ts +8 -0
- package/src/render/gallery/GalleryGrid.vue +162 -0
- package/src/render/gallery/GalleryLightbox.vue +162 -0
- package/src/render/gallery/index.ts +9 -0
- package/src/render/icon/Icon.vue +22 -0
- package/src/render/icon/index.ts +2 -0
- package/src/render/index.ts +76 -0
- package/src/render/tooltip/Tooltip.vue +35 -0
- package/src/render/tooltip/index.ts +2 -0
- package/src/render/youtube/YouTubeDefault.vue +72 -0
- package/src/render/youtube/index.ts +8 -0
|
@@ -0,0 +1,159 @@
|
|
|
1
|
+
import { isVirtualClick, getEventTarget } from "../../dom-query/dist/event.js";
|
|
2
|
+
import { isMac } from "../../dom-query/dist/platform.js";
|
|
3
|
+
import { getWindow, getDocument, getActiveElement } from "../../dom-query/dist/node.js";
|
|
4
|
+
function isValidKey(e) {
|
|
5
|
+
return !(e.metaKey || !isMac() && e.altKey || e.ctrlKey || e.key === "Control" || e.key === "Shift" || e.key === "Meta");
|
|
6
|
+
}
|
|
7
|
+
var nonTextInputTypes = /* @__PURE__ */ new Set(["checkbox", "radio", "range", "color", "file", "image", "button", "submit", "reset"]);
|
|
8
|
+
function isKeyboardFocusEvent(isTextInput, modality, e) {
|
|
9
|
+
const eventTarget = e ? getEventTarget(e) : null;
|
|
10
|
+
const doc = getDocument(eventTarget);
|
|
11
|
+
const win = getWindow(eventTarget);
|
|
12
|
+
const activeElement = getActiveElement(doc);
|
|
13
|
+
isTextInput = isTextInput || activeElement instanceof win.HTMLInputElement && !nonTextInputTypes.has(activeElement?.type) || activeElement instanceof win.HTMLTextAreaElement || activeElement instanceof win.HTMLElement && activeElement.isContentEditable;
|
|
14
|
+
return !(isTextInput && modality === "keyboard" && e instanceof win.KeyboardEvent && !Reflect.has(FOCUS_VISIBLE_INPUT_KEYS, e.key));
|
|
15
|
+
}
|
|
16
|
+
var currentModality = null;
|
|
17
|
+
var changeHandlers = /* @__PURE__ */ new Set();
|
|
18
|
+
var listenerMap = /* @__PURE__ */ new Map();
|
|
19
|
+
var hasEventBeforeFocus = false;
|
|
20
|
+
var hasBlurredWindowRecently = false;
|
|
21
|
+
var ignoreFocusEvent = false;
|
|
22
|
+
var FOCUS_VISIBLE_INPUT_KEYS = {
|
|
23
|
+
Tab: true,
|
|
24
|
+
Escape: true
|
|
25
|
+
};
|
|
26
|
+
function triggerChangeHandlers(modality, e) {
|
|
27
|
+
for (let handler of changeHandlers) {
|
|
28
|
+
handler(modality, e);
|
|
29
|
+
}
|
|
30
|
+
}
|
|
31
|
+
function handleKeyboardEvent(e) {
|
|
32
|
+
hasEventBeforeFocus = true;
|
|
33
|
+
if (isValidKey(e)) {
|
|
34
|
+
currentModality = "keyboard";
|
|
35
|
+
triggerChangeHandlers("keyboard", e);
|
|
36
|
+
}
|
|
37
|
+
}
|
|
38
|
+
function handlePointerEvent(e) {
|
|
39
|
+
currentModality = "pointer";
|
|
40
|
+
if (e.type === "mousedown" || e.type === "pointerdown") {
|
|
41
|
+
hasEventBeforeFocus = true;
|
|
42
|
+
triggerChangeHandlers("pointer", e);
|
|
43
|
+
}
|
|
44
|
+
}
|
|
45
|
+
function handleClickEvent(e) {
|
|
46
|
+
if (isVirtualClick(e)) {
|
|
47
|
+
hasEventBeforeFocus = true;
|
|
48
|
+
currentModality = "virtual";
|
|
49
|
+
}
|
|
50
|
+
}
|
|
51
|
+
function handleFocusEvent(e) {
|
|
52
|
+
const target = getEventTarget(e);
|
|
53
|
+
if (target === getWindow(target) || target === getDocument(target) || ignoreFocusEvent || !e.isTrusted) {
|
|
54
|
+
return;
|
|
55
|
+
}
|
|
56
|
+
if (!hasEventBeforeFocus && !hasBlurredWindowRecently) {
|
|
57
|
+
currentModality = "virtual";
|
|
58
|
+
triggerChangeHandlers("virtual", e);
|
|
59
|
+
}
|
|
60
|
+
hasEventBeforeFocus = false;
|
|
61
|
+
hasBlurredWindowRecently = false;
|
|
62
|
+
}
|
|
63
|
+
function handleWindowBlur() {
|
|
64
|
+
hasEventBeforeFocus = false;
|
|
65
|
+
hasBlurredWindowRecently = true;
|
|
66
|
+
}
|
|
67
|
+
function setupGlobalFocusEvents(root) {
|
|
68
|
+
if (typeof window === "undefined" || listenerMap.get(getWindow(root))) {
|
|
69
|
+
return;
|
|
70
|
+
}
|
|
71
|
+
const win = getWindow(root);
|
|
72
|
+
const doc = getDocument(root);
|
|
73
|
+
let focus = win.HTMLElement.prototype.focus;
|
|
74
|
+
function patchedFocus() {
|
|
75
|
+
hasEventBeforeFocus = true;
|
|
76
|
+
focus.apply(this, arguments);
|
|
77
|
+
}
|
|
78
|
+
try {
|
|
79
|
+
Object.defineProperty(win.HTMLElement.prototype, "focus", {
|
|
80
|
+
configurable: true,
|
|
81
|
+
value: patchedFocus
|
|
82
|
+
});
|
|
83
|
+
} catch {
|
|
84
|
+
}
|
|
85
|
+
doc.addEventListener("keydown", handleKeyboardEvent, true);
|
|
86
|
+
doc.addEventListener("keyup", handleKeyboardEvent, true);
|
|
87
|
+
doc.addEventListener("click", handleClickEvent, true);
|
|
88
|
+
win.addEventListener("focus", handleFocusEvent, true);
|
|
89
|
+
win.addEventListener("blur", handleWindowBlur, false);
|
|
90
|
+
if (typeof win.PointerEvent !== "undefined") {
|
|
91
|
+
doc.addEventListener("pointerdown", handlePointerEvent, true);
|
|
92
|
+
doc.addEventListener("pointermove", handlePointerEvent, true);
|
|
93
|
+
doc.addEventListener("pointerup", handlePointerEvent, true);
|
|
94
|
+
} else {
|
|
95
|
+
doc.addEventListener("mousedown", handlePointerEvent, true);
|
|
96
|
+
doc.addEventListener("mousemove", handlePointerEvent, true);
|
|
97
|
+
doc.addEventListener("mouseup", handlePointerEvent, true);
|
|
98
|
+
}
|
|
99
|
+
win.addEventListener(
|
|
100
|
+
"beforeunload",
|
|
101
|
+
() => {
|
|
102
|
+
tearDownWindowFocusTracking(root);
|
|
103
|
+
},
|
|
104
|
+
{ once: true }
|
|
105
|
+
);
|
|
106
|
+
listenerMap.set(win, { focus });
|
|
107
|
+
}
|
|
108
|
+
var tearDownWindowFocusTracking = (root, loadListener) => {
|
|
109
|
+
const win = getWindow(root);
|
|
110
|
+
const doc = getDocument(root);
|
|
111
|
+
const listenerData = listenerMap.get(win);
|
|
112
|
+
if (!listenerData) {
|
|
113
|
+
return;
|
|
114
|
+
}
|
|
115
|
+
try {
|
|
116
|
+
Object.defineProperty(win.HTMLElement.prototype, "focus", {
|
|
117
|
+
configurable: true,
|
|
118
|
+
value: listenerData.focus
|
|
119
|
+
});
|
|
120
|
+
} catch {
|
|
121
|
+
}
|
|
122
|
+
doc.removeEventListener("keydown", handleKeyboardEvent, true);
|
|
123
|
+
doc.removeEventListener("keyup", handleKeyboardEvent, true);
|
|
124
|
+
doc.removeEventListener("click", handleClickEvent, true);
|
|
125
|
+
win.removeEventListener("focus", handleFocusEvent, true);
|
|
126
|
+
win.removeEventListener("blur", handleWindowBlur, false);
|
|
127
|
+
if (typeof win.PointerEvent !== "undefined") {
|
|
128
|
+
doc.removeEventListener("pointerdown", handlePointerEvent, true);
|
|
129
|
+
doc.removeEventListener("pointermove", handlePointerEvent, true);
|
|
130
|
+
doc.removeEventListener("pointerup", handlePointerEvent, true);
|
|
131
|
+
} else {
|
|
132
|
+
doc.removeEventListener("mousedown", handlePointerEvent, true);
|
|
133
|
+
doc.removeEventListener("mousemove", handlePointerEvent, true);
|
|
134
|
+
doc.removeEventListener("mouseup", handlePointerEvent, true);
|
|
135
|
+
}
|
|
136
|
+
listenerMap.delete(win);
|
|
137
|
+
};
|
|
138
|
+
function isFocusVisible() {
|
|
139
|
+
return currentModality === "keyboard" || currentModality === "virtual";
|
|
140
|
+
}
|
|
141
|
+
function trackFocusVisible(props = {}) {
|
|
142
|
+
const { isTextInput, autoFocus, onChange, root } = props;
|
|
143
|
+
setupGlobalFocusEvents(root);
|
|
144
|
+
onChange?.({ isFocusVisible: autoFocus || isFocusVisible(), modality: currentModality });
|
|
145
|
+
const handler = (modality, e) => {
|
|
146
|
+
if (!isKeyboardFocusEvent(!!isTextInput, modality, e)) return;
|
|
147
|
+
onChange?.({ isFocusVisible: isFocusVisible(), modality });
|
|
148
|
+
};
|
|
149
|
+
changeHandlers.add(handler);
|
|
150
|
+
return () => {
|
|
151
|
+
changeHandlers.delete(handler);
|
|
152
|
+
};
|
|
153
|
+
}
|
|
154
|
+
export {
|
|
155
|
+
ignoreFocusEvent,
|
|
156
|
+
isFocusVisible,
|
|
157
|
+
listenerMap,
|
|
158
|
+
trackFocusVisible
|
|
159
|
+
};
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
import { isHTMLElement } from "../../dom-query/dist/node.js";
|
|
2
|
+
function createDOMRect(x = 0, y = 0, width = 0, height = 0) {
|
|
3
|
+
if (typeof DOMRect === "function") {
|
|
4
|
+
return new DOMRect(x, y, width, height);
|
|
5
|
+
}
|
|
6
|
+
const rect = {
|
|
7
|
+
x,
|
|
8
|
+
y,
|
|
9
|
+
width,
|
|
10
|
+
height,
|
|
11
|
+
top: y,
|
|
12
|
+
right: x + width,
|
|
13
|
+
bottom: y + height,
|
|
14
|
+
left: x
|
|
15
|
+
};
|
|
16
|
+
return { ...rect, toJSON: () => rect };
|
|
17
|
+
}
|
|
18
|
+
function getDOMRect(anchorRect) {
|
|
19
|
+
if (!anchorRect) return createDOMRect();
|
|
20
|
+
const { x, y, width, height } = anchorRect;
|
|
21
|
+
return createDOMRect(x, y, width, height);
|
|
22
|
+
}
|
|
23
|
+
function getAnchorElement(anchorElement, getAnchorRect) {
|
|
24
|
+
return {
|
|
25
|
+
contextElement: isHTMLElement(anchorElement) ? anchorElement : anchorElement?.contextElement,
|
|
26
|
+
getBoundingClientRect: () => {
|
|
27
|
+
const anchor = anchorElement;
|
|
28
|
+
const anchorRect = getAnchorRect?.(anchor);
|
|
29
|
+
if (anchorRect || !anchor) {
|
|
30
|
+
return getDOMRect(anchorRect);
|
|
31
|
+
}
|
|
32
|
+
return anchor.getBoundingClientRect();
|
|
33
|
+
}
|
|
34
|
+
};
|
|
35
|
+
}
|
|
36
|
+
export {
|
|
37
|
+
createDOMRect,
|
|
38
|
+
getAnchorElement
|
|
39
|
+
};
|
|
@@ -0,0 +1,296 @@
|
|
|
1
|
+
import { computePosition, autoUpdate, offset, flip, shift, arrow, size, hide, limitShift } from "../../../@floating-ui/dom/dist/floating-ui.dom.js";
|
|
2
|
+
import { getAnchorElement } from "./get-anchor.js";
|
|
3
|
+
import { shiftArrowMiddleware, createTransformOriginMiddleware, rectMiddleware } from "./middleware.js";
|
|
4
|
+
import { getPlacementDetails } from "./placement.js";
|
|
5
|
+
import { noop } from "../../utils/dist/functions.js";
|
|
6
|
+
import { isNull } from "../../utils/dist/guard.js";
|
|
7
|
+
import { raf } from "../../dom-query/dist/raf.js";
|
|
8
|
+
import { getWindow, isHTMLElement } from "../../dom-query/dist/node.js";
|
|
9
|
+
import { getComputedStyle } from "../../dom-query/dist/computed-style.js";
|
|
10
|
+
import { compact } from "../../utils/dist/object.js";
|
|
11
|
+
var defaultOptions = {
|
|
12
|
+
strategy: "absolute",
|
|
13
|
+
placement: "bottom",
|
|
14
|
+
listeners: true,
|
|
15
|
+
restoreStyles: false,
|
|
16
|
+
gutter: 8,
|
|
17
|
+
flip: true,
|
|
18
|
+
slide: true,
|
|
19
|
+
overlap: false,
|
|
20
|
+
sameWidth: false,
|
|
21
|
+
fitViewport: false,
|
|
22
|
+
overflowPadding: 8,
|
|
23
|
+
arrowPadding: 4
|
|
24
|
+
};
|
|
25
|
+
function roundByDpr(win, value) {
|
|
26
|
+
const dpr = win.devicePixelRatio || 1;
|
|
27
|
+
return Math.round(value * dpr) / dpr;
|
|
28
|
+
}
|
|
29
|
+
function isApproximatelyEqual(a, b) {
|
|
30
|
+
return a != null && Math.abs(a - b) < 0.5;
|
|
31
|
+
}
|
|
32
|
+
function resolveBoundaryOption(boundary) {
|
|
33
|
+
if (typeof boundary === "function") return boundary();
|
|
34
|
+
if (boundary === "clipping-ancestors") return "clippingAncestors";
|
|
35
|
+
return boundary;
|
|
36
|
+
}
|
|
37
|
+
function getArrowMiddleware(arrowElement, doc, opts) {
|
|
38
|
+
const element = arrowElement || doc.createElement("div");
|
|
39
|
+
return arrow({ element, padding: opts.arrowPadding });
|
|
40
|
+
}
|
|
41
|
+
function getOffsetMiddleware(arrowElement, opts) {
|
|
42
|
+
if (isNull(opts.offset ?? opts.gutter)) return;
|
|
43
|
+
return offset(({ placement }) => {
|
|
44
|
+
const arrowOffset = (arrowElement?.clientHeight || 0) / 2;
|
|
45
|
+
const gutter = opts.offset?.mainAxis ?? opts.gutter;
|
|
46
|
+
const mainAxis = typeof gutter === "number" ? gutter + arrowOffset : gutter ?? arrowOffset;
|
|
47
|
+
const { hasAlign } = getPlacementDetails(placement);
|
|
48
|
+
const shift2 = !hasAlign ? opts.shift : void 0;
|
|
49
|
+
const crossAxis = opts.offset?.crossAxis ?? shift2;
|
|
50
|
+
return compact({
|
|
51
|
+
crossAxis,
|
|
52
|
+
mainAxis,
|
|
53
|
+
alignmentAxis: opts.shift
|
|
54
|
+
});
|
|
55
|
+
});
|
|
56
|
+
}
|
|
57
|
+
function getFlipMiddleware(opts) {
|
|
58
|
+
if (!opts.flip) return;
|
|
59
|
+
const boundary = resolveBoundaryOption(opts.boundary);
|
|
60
|
+
return flip({
|
|
61
|
+
...boundary ? { boundary } : void 0,
|
|
62
|
+
padding: opts.overflowPadding,
|
|
63
|
+
fallbackPlacements: opts.flip === true ? void 0 : opts.flip
|
|
64
|
+
});
|
|
65
|
+
}
|
|
66
|
+
function getShiftMiddleware(opts) {
|
|
67
|
+
if (!opts.slide && !opts.overlap) return;
|
|
68
|
+
const boundary = resolveBoundaryOption(opts.boundary);
|
|
69
|
+
return shift({
|
|
70
|
+
...boundary ? { boundary } : void 0,
|
|
71
|
+
mainAxis: opts.slide,
|
|
72
|
+
crossAxis: opts.overlap,
|
|
73
|
+
padding: opts.overflowPadding,
|
|
74
|
+
limiter: limitShift()
|
|
75
|
+
});
|
|
76
|
+
}
|
|
77
|
+
function getSizeMiddleware(opts) {
|
|
78
|
+
if (opts.sizeMiddleware === false && !opts.sameWidth && !opts.fitViewport) return;
|
|
79
|
+
let lastReferenceWidth;
|
|
80
|
+
let lastReferenceHeight;
|
|
81
|
+
let lastAvailableWidth;
|
|
82
|
+
let lastAvailableHeight;
|
|
83
|
+
return size({
|
|
84
|
+
padding: opts.overflowPadding,
|
|
85
|
+
apply({ elements, rects, availableHeight, availableWidth }) {
|
|
86
|
+
const floating = elements.floating;
|
|
87
|
+
const referenceWidth = Math.round(rects.reference.width);
|
|
88
|
+
const referenceHeight = Math.round(rects.reference.height);
|
|
89
|
+
availableWidth = Math.floor(availableWidth);
|
|
90
|
+
availableHeight = Math.floor(availableHeight);
|
|
91
|
+
if (!isApproximatelyEqual(lastReferenceWidth, referenceWidth)) {
|
|
92
|
+
floating.style.setProperty("--reference-width", `${referenceWidth}px`);
|
|
93
|
+
lastReferenceWidth = referenceWidth;
|
|
94
|
+
}
|
|
95
|
+
if (!isApproximatelyEqual(lastReferenceHeight, referenceHeight)) {
|
|
96
|
+
floating.style.setProperty("--reference-height", `${referenceHeight}px`);
|
|
97
|
+
lastReferenceHeight = referenceHeight;
|
|
98
|
+
}
|
|
99
|
+
if (!isApproximatelyEqual(lastAvailableWidth, availableWidth)) {
|
|
100
|
+
floating.style.setProperty("--available-width", `${availableWidth}px`);
|
|
101
|
+
lastAvailableWidth = availableWidth;
|
|
102
|
+
}
|
|
103
|
+
if (!isApproximatelyEqual(lastAvailableHeight, availableHeight)) {
|
|
104
|
+
floating.style.setProperty("--available-height", `${availableHeight}px`);
|
|
105
|
+
lastAvailableHeight = availableHeight;
|
|
106
|
+
}
|
|
107
|
+
}
|
|
108
|
+
});
|
|
109
|
+
}
|
|
110
|
+
function hideWhenDetachedMiddleware(opts) {
|
|
111
|
+
if (!opts.hideWhenDetached) return;
|
|
112
|
+
return hide({ strategy: "referenceHidden", boundary: resolveBoundaryOption(opts.boundary) ?? "clippingAncestors" });
|
|
113
|
+
}
|
|
114
|
+
function getAutoUpdateOptions(opts) {
|
|
115
|
+
if (!opts) return {};
|
|
116
|
+
if (opts === true) {
|
|
117
|
+
return { ancestorResize: true, ancestorScroll: true, elementResize: true, layoutShift: true };
|
|
118
|
+
}
|
|
119
|
+
return opts;
|
|
120
|
+
}
|
|
121
|
+
var floatingStyleProps = [
|
|
122
|
+
"transform",
|
|
123
|
+
"visibility",
|
|
124
|
+
"pointer-events",
|
|
125
|
+
"--x",
|
|
126
|
+
"--y",
|
|
127
|
+
"--z-index",
|
|
128
|
+
"--reference-width",
|
|
129
|
+
"--reference-height",
|
|
130
|
+
"--available-width",
|
|
131
|
+
"--available-height",
|
|
132
|
+
"--transform-origin"
|
|
133
|
+
];
|
|
134
|
+
var arrowStyleProps = ["top", "right", "bottom", "left"];
|
|
135
|
+
function createStyleCleanup(el, props) {
|
|
136
|
+
if (!el) return noop;
|
|
137
|
+
const prev = new Map(props.map((prop) => [prop, el.style.getPropertyValue(prop)]));
|
|
138
|
+
return () => {
|
|
139
|
+
prev.forEach((value, prop) => {
|
|
140
|
+
if (value) el.style.setProperty(prop, value);
|
|
141
|
+
else el.style.removeProperty(prop);
|
|
142
|
+
});
|
|
143
|
+
if (el.style.length === 0) {
|
|
144
|
+
el.removeAttribute("style");
|
|
145
|
+
}
|
|
146
|
+
};
|
|
147
|
+
}
|
|
148
|
+
function anchorIdentity(anchor) {
|
|
149
|
+
if (anchor == null) return null;
|
|
150
|
+
if (isHTMLElement(anchor)) return anchor;
|
|
151
|
+
if (typeof anchor === "object" && anchor && "contextElement" in anchor && anchor.contextElement) {
|
|
152
|
+
return anchor.contextElement;
|
|
153
|
+
}
|
|
154
|
+
return anchor;
|
|
155
|
+
}
|
|
156
|
+
function getPlacementImpl(referenceOrVirtual, floatingOrVirtual, opts = {}) {
|
|
157
|
+
const resolveFloating = () => {
|
|
158
|
+
const raw = typeof floatingOrVirtual === "function" ? floatingOrVirtual() : floatingOrVirtual;
|
|
159
|
+
return raw ?? null;
|
|
160
|
+
};
|
|
161
|
+
const resolveAnchor = () => {
|
|
162
|
+
const raw = typeof referenceOrVirtual === "function" ? referenceOrVirtual() : referenceOrVirtual;
|
|
163
|
+
return opts.getAnchorElement?.() ?? raw;
|
|
164
|
+
};
|
|
165
|
+
const resolveReference = () => {
|
|
166
|
+
const anchor = resolveAnchor();
|
|
167
|
+
if (!anchor && !opts.getAnchorRect) return null;
|
|
168
|
+
return getAnchorElement(anchor, opts.getAnchorRect);
|
|
169
|
+
};
|
|
170
|
+
const options = Object.assign({}, defaultOptions, opts);
|
|
171
|
+
let middleware = [];
|
|
172
|
+
let cachedMiddlewareFloating = null;
|
|
173
|
+
let restoreFloatingStyles;
|
|
174
|
+
let restoreArrowStyles;
|
|
175
|
+
function rebuildMiddlewareForFloating(floating) {
|
|
176
|
+
restoreFloatingStyles?.();
|
|
177
|
+
restoreArrowStyles?.();
|
|
178
|
+
cachedMiddlewareFloating = floating;
|
|
179
|
+
restoreFloatingStyles = options.restoreStyles ? createStyleCleanup(floating, floatingStyleProps) : void 0;
|
|
180
|
+
const arrowEl = floating.querySelector("[data-part=arrow]");
|
|
181
|
+
restoreArrowStyles = options.restoreStyles ? createStyleCleanup(arrowEl, arrowStyleProps) : void 0;
|
|
182
|
+
middleware = [
|
|
183
|
+
getOffsetMiddleware(arrowEl, options),
|
|
184
|
+
getFlipMiddleware(options),
|
|
185
|
+
getShiftMiddleware(options),
|
|
186
|
+
getArrowMiddleware(arrowEl, floating.ownerDocument, options),
|
|
187
|
+
shiftArrowMiddleware(arrowEl),
|
|
188
|
+
createTransformOriginMiddleware(
|
|
189
|
+
{ gutter: options.gutter, offset: options.offset, overlap: options.overlap },
|
|
190
|
+
arrowEl
|
|
191
|
+
),
|
|
192
|
+
getSizeMiddleware(options),
|
|
193
|
+
hideWhenDetachedMiddleware(options),
|
|
194
|
+
rectMiddleware
|
|
195
|
+
];
|
|
196
|
+
}
|
|
197
|
+
const { placement, strategy, onComplete, onPositioned } = options;
|
|
198
|
+
let lastX;
|
|
199
|
+
let lastY;
|
|
200
|
+
let zIndexComputed = false;
|
|
201
|
+
let lastAnchorForObserve = void 0;
|
|
202
|
+
let lastFloatingForObserve = void 0;
|
|
203
|
+
let cancelAutoUpdate = noop;
|
|
204
|
+
const autoUpdateOptions = getAutoUpdateOptions(options.listeners);
|
|
205
|
+
function syncAutoUpdateObservers() {
|
|
206
|
+
if (!options.listeners) return;
|
|
207
|
+
const anchor = resolveAnchor();
|
|
208
|
+
const reference = resolveReference();
|
|
209
|
+
const floating = resolveFloating();
|
|
210
|
+
if (!reference || !floating) return;
|
|
211
|
+
const anchorChanged = anchorIdentity(anchor) !== anchorIdentity(lastAnchorForObserve);
|
|
212
|
+
const floatingChanged = floating !== lastFloatingForObserve;
|
|
213
|
+
if (anchorChanged || floatingChanged) {
|
|
214
|
+
cancelAutoUpdate();
|
|
215
|
+
lastAnchorForObserve = anchor;
|
|
216
|
+
lastFloatingForObserve = floating;
|
|
217
|
+
cancelAutoUpdate = autoUpdate(reference, floating, runUpdate, autoUpdateOptions);
|
|
218
|
+
}
|
|
219
|
+
}
|
|
220
|
+
async function updatePosition() {
|
|
221
|
+
syncAutoUpdateObservers();
|
|
222
|
+
const floating = resolveFloating();
|
|
223
|
+
if (!floating) return;
|
|
224
|
+
if (floating !== cachedMiddlewareFloating) {
|
|
225
|
+
rebuildMiddlewareForFloating(floating);
|
|
226
|
+
zIndexComputed = false;
|
|
227
|
+
}
|
|
228
|
+
const reference = resolveReference();
|
|
229
|
+
if (!reference) return;
|
|
230
|
+
const pos = await computePosition(reference, floating, {
|
|
231
|
+
placement,
|
|
232
|
+
middleware,
|
|
233
|
+
strategy
|
|
234
|
+
});
|
|
235
|
+
onComplete?.(pos);
|
|
236
|
+
const win = getWindow(floating);
|
|
237
|
+
const x = roundByDpr(win, pos.x);
|
|
238
|
+
const y = roundByDpr(win, pos.y);
|
|
239
|
+
if (!isApproximatelyEqual(lastX, x)) {
|
|
240
|
+
floating.style.setProperty("--x", `${x}px`);
|
|
241
|
+
lastX = x;
|
|
242
|
+
}
|
|
243
|
+
if (!isApproximatelyEqual(lastY, y)) {
|
|
244
|
+
floating.style.setProperty("--y", `${y}px`);
|
|
245
|
+
lastY = y;
|
|
246
|
+
}
|
|
247
|
+
if (options.hideWhenDetached) {
|
|
248
|
+
const isHidden = pos.middlewareData.hide?.referenceHidden;
|
|
249
|
+
if (isHidden) {
|
|
250
|
+
floating.style.setProperty("visibility", "hidden");
|
|
251
|
+
floating.style.setProperty("pointer-events", "none");
|
|
252
|
+
} else {
|
|
253
|
+
floating.style.removeProperty("visibility");
|
|
254
|
+
floating.style.removeProperty("pointer-events");
|
|
255
|
+
}
|
|
256
|
+
}
|
|
257
|
+
if (!zIndexComputed) {
|
|
258
|
+
const contentEl = floating.firstElementChild;
|
|
259
|
+
if (contentEl) {
|
|
260
|
+
floating.style.setProperty("--z-index", getComputedStyle(contentEl).zIndex);
|
|
261
|
+
zIndexComputed = true;
|
|
262
|
+
}
|
|
263
|
+
}
|
|
264
|
+
}
|
|
265
|
+
async function runUpdate() {
|
|
266
|
+
if (opts.updatePosition) {
|
|
267
|
+
await opts.updatePosition({ updatePosition, floatingElement: resolveFloating() });
|
|
268
|
+
onPositioned?.({ placed: true });
|
|
269
|
+
} else {
|
|
270
|
+
await updatePosition();
|
|
271
|
+
}
|
|
272
|
+
}
|
|
273
|
+
runUpdate();
|
|
274
|
+
return () => {
|
|
275
|
+
cancelAutoUpdate();
|
|
276
|
+
restoreArrowStyles?.();
|
|
277
|
+
restoreFloatingStyles?.();
|
|
278
|
+
onPositioned?.({ placed: false });
|
|
279
|
+
};
|
|
280
|
+
}
|
|
281
|
+
function getPlacement(referenceOrFn, floatingOrFn, opts = {}) {
|
|
282
|
+
const { defer, ...options } = opts;
|
|
283
|
+
const func = defer ? raf : (v) => v();
|
|
284
|
+
const cleanups = [];
|
|
285
|
+
cleanups.push(
|
|
286
|
+
func(() => {
|
|
287
|
+
cleanups.push(getPlacementImpl(referenceOrFn, floatingOrFn, options));
|
|
288
|
+
})
|
|
289
|
+
);
|
|
290
|
+
return () => {
|
|
291
|
+
cleanups.forEach((fn) => fn?.());
|
|
292
|
+
};
|
|
293
|
+
}
|
|
294
|
+
export {
|
|
295
|
+
getPlacement
|
|
296
|
+
};
|
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
import { cssVars } from "./middleware.js";
|
|
2
|
+
var ARROW_FLOATING_STYLE = {
|
|
3
|
+
bottom: "rotate(45deg)",
|
|
4
|
+
left: "rotate(135deg)",
|
|
5
|
+
top: "rotate(225deg)",
|
|
6
|
+
right: "rotate(315deg)"
|
|
7
|
+
};
|
|
8
|
+
function getPlacementStyles(options = {}) {
|
|
9
|
+
const { placement, sameWidth, fitViewport, strategy = "absolute" } = options;
|
|
10
|
+
return {
|
|
11
|
+
arrow: {
|
|
12
|
+
position: "absolute",
|
|
13
|
+
width: cssVars.arrowSize.reference,
|
|
14
|
+
height: cssVars.arrowSize.reference,
|
|
15
|
+
[cssVars.arrowSizeHalf.variable]: `calc(${cssVars.arrowSize.reference} / 2)`,
|
|
16
|
+
[cssVars.arrowOffset.variable]: `calc(${cssVars.arrowSizeHalf.reference} * -1)`
|
|
17
|
+
},
|
|
18
|
+
arrowTip: {
|
|
19
|
+
// @ts-expect-error - Fix this
|
|
20
|
+
transform: placement ? ARROW_FLOATING_STYLE[placement.split("-")[0]] : void 0,
|
|
21
|
+
background: cssVars.arrowBg.reference,
|
|
22
|
+
top: "0",
|
|
23
|
+
left: "0",
|
|
24
|
+
width: "100%",
|
|
25
|
+
height: "100%",
|
|
26
|
+
position: "absolute",
|
|
27
|
+
zIndex: "inherit"
|
|
28
|
+
},
|
|
29
|
+
floating: {
|
|
30
|
+
position: strategy,
|
|
31
|
+
isolation: "isolate",
|
|
32
|
+
minWidth: sameWidth ? void 0 : "max-content",
|
|
33
|
+
width: sameWidth ? "var(--reference-width)" : void 0,
|
|
34
|
+
maxWidth: fitViewport ? "var(--available-width)" : void 0,
|
|
35
|
+
maxHeight: fitViewport ? "var(--available-height)" : void 0,
|
|
36
|
+
pointerEvents: !placement ? "none" : void 0,
|
|
37
|
+
top: "0px",
|
|
38
|
+
left: "0px",
|
|
39
|
+
// move off-screen if placement is not defined
|
|
40
|
+
transform: placement ? "translate3d(var(--x), var(--y), 0)" : "translate3d(0, -100vh, 0)",
|
|
41
|
+
zIndex: "var(--z-index)"
|
|
42
|
+
}
|
|
43
|
+
};
|
|
44
|
+
}
|
|
45
|
+
export {
|
|
46
|
+
getPlacementStyles
|
|
47
|
+
};
|
|
@@ -0,0 +1,79 @@
|
|
|
1
|
+
var toVar = (value) => ({ variable: value, reference: `var(${value})` });
|
|
2
|
+
var cssVars = {
|
|
3
|
+
arrowSize: toVar("--arrow-size"),
|
|
4
|
+
arrowSizeHalf: toVar("--arrow-size-half"),
|
|
5
|
+
arrowBg: toVar("--arrow-background"),
|
|
6
|
+
transformOrigin: toVar("--transform-origin"),
|
|
7
|
+
arrowOffset: toVar("--arrow-offset")
|
|
8
|
+
};
|
|
9
|
+
var getSideAxis = (side) => side === "top" || side === "bottom" ? "y" : "x";
|
|
10
|
+
function createTransformOriginMiddleware(opts, arrowEl) {
|
|
11
|
+
return {
|
|
12
|
+
name: "transformOrigin",
|
|
13
|
+
fn(state) {
|
|
14
|
+
const { elements, middlewareData, placement, rects, y } = state;
|
|
15
|
+
const side = placement.split("-")[0];
|
|
16
|
+
const axis = getSideAxis(side);
|
|
17
|
+
const arrowX = middlewareData.arrow?.x || 0;
|
|
18
|
+
const arrowY = middlewareData.arrow?.y || 0;
|
|
19
|
+
const arrowWidth = arrowEl?.clientWidth || 0;
|
|
20
|
+
const arrowHeight = arrowEl?.clientHeight || 0;
|
|
21
|
+
const transformX = arrowX + arrowWidth / 2;
|
|
22
|
+
const transformY = arrowY + arrowHeight / 2;
|
|
23
|
+
const shiftY = Math.abs(middlewareData.shift?.y || 0);
|
|
24
|
+
const halfAnchorHeight = rects.reference.height / 2;
|
|
25
|
+
const arrowOffset = arrowHeight / 2;
|
|
26
|
+
const gutter = opts.offset?.mainAxis ?? opts.gutter;
|
|
27
|
+
const sideOffsetValue = typeof gutter === "number" ? gutter + arrowOffset : gutter ?? arrowOffset;
|
|
28
|
+
const isOverlappingAnchor = shiftY > sideOffsetValue;
|
|
29
|
+
const adjacentTransformOrigin = {
|
|
30
|
+
top: `${transformX}px calc(100% + ${sideOffsetValue}px)`,
|
|
31
|
+
bottom: `${transformX}px ${-sideOffsetValue}px`,
|
|
32
|
+
left: `calc(100% + ${sideOffsetValue}px) ${transformY}px`,
|
|
33
|
+
right: `${-sideOffsetValue}px ${transformY}px`
|
|
34
|
+
}[side];
|
|
35
|
+
const overlapTransformOrigin = `${transformX}px ${rects.reference.y + halfAnchorHeight - y}px`;
|
|
36
|
+
const useOverlap = Boolean(opts.overlap) && axis === "y" && isOverlappingAnchor;
|
|
37
|
+
elements.floating.style.setProperty(
|
|
38
|
+
cssVars.transformOrigin.variable,
|
|
39
|
+
useOverlap ? overlapTransformOrigin : adjacentTransformOrigin
|
|
40
|
+
);
|
|
41
|
+
return {
|
|
42
|
+
data: {
|
|
43
|
+
transformOrigin: useOverlap ? overlapTransformOrigin : adjacentTransformOrigin
|
|
44
|
+
}
|
|
45
|
+
};
|
|
46
|
+
}
|
|
47
|
+
};
|
|
48
|
+
}
|
|
49
|
+
var rectMiddleware = {
|
|
50
|
+
name: "rects",
|
|
51
|
+
fn({ rects }) {
|
|
52
|
+
return {
|
|
53
|
+
data: rects
|
|
54
|
+
};
|
|
55
|
+
}
|
|
56
|
+
};
|
|
57
|
+
var shiftArrowMiddleware = (arrowEl) => {
|
|
58
|
+
if (!arrowEl) return;
|
|
59
|
+
return {
|
|
60
|
+
name: "shiftArrow",
|
|
61
|
+
fn({ placement, middlewareData }) {
|
|
62
|
+
if (!middlewareData.arrow) return {};
|
|
63
|
+
const { x, y } = middlewareData.arrow;
|
|
64
|
+
const dir = placement.split("-")[0];
|
|
65
|
+
Object.assign(arrowEl.style, {
|
|
66
|
+
left: x != null ? `${x}px` : "",
|
|
67
|
+
top: y != null ? `${y}px` : "",
|
|
68
|
+
[dir]: `calc(100% + ${cssVars.arrowOffset.reference})`
|
|
69
|
+
});
|
|
70
|
+
return {};
|
|
71
|
+
}
|
|
72
|
+
};
|
|
73
|
+
};
|
|
74
|
+
export {
|
|
75
|
+
createTransformOriginMiddleware,
|
|
76
|
+
cssVars,
|
|
77
|
+
rectMiddleware,
|
|
78
|
+
shiftArrowMiddleware
|
|
79
|
+
};
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
function connect(service, _normalize) {
|
|
2
|
+
const { state, send, context } = service;
|
|
3
|
+
const present = state.matches("mounted", "unmountSuspended");
|
|
4
|
+
return {
|
|
5
|
+
skip: !context.get("initial"),
|
|
6
|
+
present,
|
|
7
|
+
setNode(node) {
|
|
8
|
+
if (!node) return;
|
|
9
|
+
send({ type: "NODE.SET", node });
|
|
10
|
+
},
|
|
11
|
+
unmount() {
|
|
12
|
+
send({ type: "UNMOUNT" });
|
|
13
|
+
}
|
|
14
|
+
};
|
|
15
|
+
}
|
|
16
|
+
export {
|
|
17
|
+
connect
|
|
18
|
+
};
|