overtype 2.1.1 → 2.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +25 -22
- package/dist/overtype-webcomponent.esm.js +1581 -97
- package/dist/overtype-webcomponent.esm.js.map +4 -4
- package/dist/overtype-webcomponent.js +1581 -97
- package/dist/overtype-webcomponent.js.map +4 -4
- package/dist/overtype-webcomponent.min.js +104 -91
- package/dist/overtype.cjs +1551 -94
- package/dist/overtype.cjs.map +4 -4
- package/dist/overtype.d.ts +16 -0
- package/dist/overtype.esm.js +1551 -94
- package/dist/overtype.esm.js.map +4 -4
- package/dist/overtype.js +1551 -94
- package/dist/overtype.js.map +4 -4
- package/dist/overtype.min.js +107 -94
- package/package.json +4 -4
- package/src/icons.js +6 -0
- package/src/link-tooltip.js +22 -67
- package/src/overtype-webcomponent.js +32 -3
- package/src/overtype.d.ts +16 -0
- package/src/overtype.js +272 -36
- package/src/parser.js +9 -3
- package/src/styles.js +36 -28
- package/src/themes.js +14 -0
- package/src/toolbar-buttons.js +23 -0
- package/src/toolbar.js +12 -0
package/dist/overtype.cjs
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* OverType v2.
|
|
2
|
+
* OverType v2.2.0
|
|
3
3
|
* A lightweight markdown editor library with perfect WYSIWYG alignment
|
|
4
4
|
* @license MIT
|
|
5
5
|
* @author David Miranda
|
|
@@ -105,6 +105,7 @@ var MarkdownParser = class {
|
|
|
105
105
|
static parseHeader(html) {
|
|
106
106
|
return html.replace(/^(#{1,3})\s(.+)$/, (match, hashes, content) => {
|
|
107
107
|
const level = hashes.length;
|
|
108
|
+
content = this.parseInlineElements(content);
|
|
108
109
|
return `<h${level}><span class="syntax-marker">${hashes} </span>${content}</h${level}>`;
|
|
109
110
|
});
|
|
110
111
|
}
|
|
@@ -136,6 +137,7 @@ var MarkdownParser = class {
|
|
|
136
137
|
*/
|
|
137
138
|
static parseBulletList(html) {
|
|
138
139
|
return html.replace(/^((?: )*)([-*+])\s(.+)$/, (match, indent, marker, content) => {
|
|
140
|
+
content = this.parseInlineElements(content);
|
|
139
141
|
return `${indent}<li class="bullet-list"><span class="syntax-marker">${marker} </span>${content}</li>`;
|
|
140
142
|
});
|
|
141
143
|
}
|
|
@@ -147,6 +149,7 @@ var MarkdownParser = class {
|
|
|
147
149
|
*/
|
|
148
150
|
static parseTaskList(html, isPreviewMode = false) {
|
|
149
151
|
return html.replace(/^((?: )*)-\s+\[([ xX])\]\s+(.+)$/, (match, indent, checked, content) => {
|
|
152
|
+
content = this.parseInlineElements(content);
|
|
150
153
|
if (isPreviewMode) {
|
|
151
154
|
const isChecked = checked.toLowerCase() === "x";
|
|
152
155
|
return `${indent}<li class="task-list"><input type="checkbox" ${isChecked ? "checked" : ""}> ${content}</li>`;
|
|
@@ -162,6 +165,7 @@ var MarkdownParser = class {
|
|
|
162
165
|
*/
|
|
163
166
|
static parseNumberedList(html) {
|
|
164
167
|
return html.replace(/^((?: )*)(\d+\.)\s(.+)$/, (match, indent, marker, content) => {
|
|
168
|
+
content = this.parseInlineElements(content);
|
|
165
169
|
return `${indent}<li class="ordered-list"><span class="syntax-marker">${marker} </span>${content}</li>`;
|
|
166
170
|
});
|
|
167
171
|
}
|
|
@@ -383,7 +387,9 @@ var MarkdownParser = class {
|
|
|
383
387
|
html = this.parseTaskList(html, isPreviewMode);
|
|
384
388
|
html = this.parseBulletList(html);
|
|
385
389
|
html = this.parseNumberedList(html);
|
|
386
|
-
html
|
|
390
|
+
if (!html.includes("<li") && !html.includes("<h")) {
|
|
391
|
+
html = this.parseInlineElements(html);
|
|
392
|
+
}
|
|
387
393
|
if (html.trim() === "") {
|
|
388
394
|
return "<div> </div>";
|
|
389
395
|
}
|
|
@@ -872,8 +878,10 @@ var solar = {
|
|
|
872
878
|
// Yale Blue - icon color
|
|
873
879
|
toolbarHover: "#f5f5f5",
|
|
874
880
|
// Light gray - hover background
|
|
875
|
-
toolbarActive: "#faf0ca"
|
|
881
|
+
toolbarActive: "#faf0ca",
|
|
876
882
|
// Lemon Chiffon - active button background
|
|
883
|
+
placeholder: "#999999"
|
|
884
|
+
// Gray - placeholder text
|
|
877
885
|
}
|
|
878
886
|
};
|
|
879
887
|
var cave = {
|
|
@@ -936,13 +944,16 @@ var cave = {
|
|
|
936
944
|
// Light blue-gray - icon color
|
|
937
945
|
toolbarHover: "#243546",
|
|
938
946
|
// Slightly lighter charcoal - hover background
|
|
939
|
-
toolbarActive: "#2a3f52"
|
|
947
|
+
toolbarActive: "#2a3f52",
|
|
940
948
|
// Even lighter - active button background
|
|
949
|
+
placeholder: "#6a7a88"
|
|
950
|
+
// Muted blue-gray - placeholder text
|
|
941
951
|
}
|
|
942
952
|
};
|
|
943
953
|
var themes = {
|
|
944
954
|
solar,
|
|
945
955
|
cave,
|
|
956
|
+
auto: solar,
|
|
946
957
|
// Aliases for backward compatibility
|
|
947
958
|
light: solar,
|
|
948
959
|
dark: cave
|
|
@@ -954,6 +965,12 @@ function getTheme(theme) {
|
|
|
954
965
|
}
|
|
955
966
|
return theme;
|
|
956
967
|
}
|
|
968
|
+
function resolveAutoTheme(themeName) {
|
|
969
|
+
if (themeName !== "auto")
|
|
970
|
+
return themeName;
|
|
971
|
+
const mq = window.matchMedia && window.matchMedia("(prefers-color-scheme: dark)");
|
|
972
|
+
return (mq == null ? void 0 : mq.matches) ? "cave" : "solar";
|
|
973
|
+
}
|
|
957
974
|
function themeToCSSVars(colors) {
|
|
958
975
|
const vars = [];
|
|
959
976
|
for (const [key, value] of Object.entries(colors)) {
|
|
@@ -1167,17 +1184,36 @@ function generateStyles(options = {}) {
|
|
|
1167
1184
|
/* Prevent mobile zoom on focus */
|
|
1168
1185
|
touch-action: manipulation !important;
|
|
1169
1186
|
|
|
1170
|
-
/* Disable autofill
|
|
1187
|
+
/* Disable autofill */
|
|
1171
1188
|
autocomplete: off !important;
|
|
1172
1189
|
autocorrect: off !important;
|
|
1173
1190
|
autocapitalize: off !important;
|
|
1174
|
-
spellcheck: false !important;
|
|
1175
1191
|
}
|
|
1176
1192
|
|
|
1177
1193
|
.overtype-wrapper .overtype-input::selection {
|
|
1178
1194
|
background-color: var(--selection, rgba(244, 211, 94, 0.4));
|
|
1179
1195
|
}
|
|
1180
1196
|
|
|
1197
|
+
/* Placeholder shim - visible when textarea is empty */
|
|
1198
|
+
.overtype-wrapper .overtype-placeholder {
|
|
1199
|
+
position: absolute !important;
|
|
1200
|
+
top: 0 !important;
|
|
1201
|
+
left: 0 !important;
|
|
1202
|
+
width: 100% !important;
|
|
1203
|
+
z-index: 0 !important;
|
|
1204
|
+
pointer-events: none !important;
|
|
1205
|
+
user-select: none !important;
|
|
1206
|
+
font-family: ${fontFamily} !important;
|
|
1207
|
+
font-size: var(--instance-font-size, ${fontSize}) !important;
|
|
1208
|
+
line-height: var(--instance-line-height, ${lineHeight}) !important;
|
|
1209
|
+
padding: var(--instance-padding, ${padding}) !important;
|
|
1210
|
+
box-sizing: border-box !important;
|
|
1211
|
+
color: var(--placeholder, #999) !important;
|
|
1212
|
+
overflow: hidden !important;
|
|
1213
|
+
white-space: nowrap !important;
|
|
1214
|
+
text-overflow: ellipsis !important;
|
|
1215
|
+
}
|
|
1216
|
+
|
|
1181
1217
|
/* Preview layer styles */
|
|
1182
1218
|
.overtype-wrapper .overtype-preview {
|
|
1183
1219
|
/* Layer positioning */
|
|
@@ -1445,6 +1481,10 @@ function generateStyles(options = {}) {
|
|
|
1445
1481
|
|
|
1446
1482
|
|
|
1447
1483
|
/* Toolbar Styles */
|
|
1484
|
+
.overtype-toolbar.overtype-toolbar-hidden {
|
|
1485
|
+
display: none !important;
|
|
1486
|
+
}
|
|
1487
|
+
|
|
1448
1488
|
.overtype-toolbar {
|
|
1449
1489
|
display: flex !important;
|
|
1450
1490
|
align-items: center !important;
|
|
@@ -1719,19 +1759,14 @@ function generateStyles(options = {}) {
|
|
|
1719
1759
|
|
|
1720
1760
|
/* Code blocks - proper pre/code styling in preview mode */
|
|
1721
1761
|
.overtype-container[data-mode="preview"] .overtype-wrapper .overtype-preview pre.code-block {
|
|
1722
|
-
background:
|
|
1723
|
-
color: #
|
|
1762
|
+
background: var(--code-bg, rgba(244, 211, 94, 0.4)) !important;
|
|
1763
|
+
color: var(--code, #0d3b66) !important;
|
|
1724
1764
|
padding: 1.2em !important;
|
|
1725
1765
|
border-radius: 3px !important;
|
|
1726
1766
|
overflow-x: auto !important;
|
|
1727
1767
|
margin: 0 !important;
|
|
1728
1768
|
display: block !important;
|
|
1729
1769
|
}
|
|
1730
|
-
|
|
1731
|
-
/* Cave theme code block background in preview mode */
|
|
1732
|
-
.overtype-container[data-theme="cave"][data-mode="preview"] .overtype-wrapper .overtype-preview pre.code-block {
|
|
1733
|
-
background: #11171F !important;
|
|
1734
|
-
}
|
|
1735
1770
|
|
|
1736
1771
|
.overtype-container[data-mode="preview"] .overtype-wrapper .overtype-preview pre.code-block code {
|
|
1737
1772
|
background: transparent !important;
|
|
@@ -1796,16 +1831,17 @@ function generateStyles(options = {}) {
|
|
|
1796
1831
|
height: 2px !important;
|
|
1797
1832
|
}
|
|
1798
1833
|
|
|
1799
|
-
/* Link Tooltip
|
|
1834
|
+
/* Link Tooltip */
|
|
1800
1835
|
.overtype-link-tooltip {
|
|
1801
|
-
/* Visual styles that work for both positioning methods */
|
|
1802
1836
|
background: #333 !important;
|
|
1803
1837
|
color: white !important;
|
|
1804
1838
|
padding: 6px 10px !important;
|
|
1805
1839
|
border-radius: 16px !important;
|
|
1806
1840
|
font-size: 12px !important;
|
|
1807
1841
|
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
|
|
1808
|
-
display:
|
|
1842
|
+
display: flex !important;
|
|
1843
|
+
visibility: hidden !important;
|
|
1844
|
+
pointer-events: none !important;
|
|
1809
1845
|
z-index: 10000 !important;
|
|
1810
1846
|
cursor: pointer !important;
|
|
1811
1847
|
box-shadow: 0 2px 8px rgba(0,0,0,0.3) !important;
|
|
@@ -1813,25 +1849,14 @@ function generateStyles(options = {}) {
|
|
|
1813
1849
|
white-space: nowrap !important;
|
|
1814
1850
|
overflow: hidden !important;
|
|
1815
1851
|
text-overflow: ellipsis !important;
|
|
1816
|
-
|
|
1817
|
-
|
|
1818
|
-
|
|
1852
|
+
position: fixed;
|
|
1853
|
+
top: 0;
|
|
1854
|
+
left: 0;
|
|
1819
1855
|
}
|
|
1820
1856
|
|
|
1821
1857
|
.overtype-link-tooltip.visible {
|
|
1822
|
-
|
|
1823
|
-
|
|
1824
|
-
|
|
1825
|
-
/* CSS Anchor Positioning (modern browsers only) */
|
|
1826
|
-
@supports (position-anchor: --x) and (position-area: center) {
|
|
1827
|
-
.overtype-link-tooltip {
|
|
1828
|
-
/* Only anchor positioning specific properties */
|
|
1829
|
-
position-anchor: var(--target-anchor, --link-0);
|
|
1830
|
-
position-area: block-end center;
|
|
1831
|
-
margin-top: 8px !important;
|
|
1832
|
-
position-try: most-width block-end inline-end, flip-inline, block-start center;
|
|
1833
|
-
position-visibility: anchors-visible;
|
|
1834
|
-
}
|
|
1858
|
+
visibility: visible !important;
|
|
1859
|
+
pointer-events: auto !important;
|
|
1835
1860
|
}
|
|
1836
1861
|
|
|
1837
1862
|
${mobileStyles}
|
|
@@ -2913,6 +2938,16 @@ var Toolbar = class {
|
|
|
2913
2938
|
} catch (error) {
|
|
2914
2939
|
}
|
|
2915
2940
|
}
|
|
2941
|
+
show() {
|
|
2942
|
+
if (this.container) {
|
|
2943
|
+
this.container.classList.remove("overtype-toolbar-hidden");
|
|
2944
|
+
}
|
|
2945
|
+
}
|
|
2946
|
+
hide() {
|
|
2947
|
+
if (this.container) {
|
|
2948
|
+
this.container.classList.add("overtype-toolbar-hidden");
|
|
2949
|
+
}
|
|
2950
|
+
}
|
|
2916
2951
|
/**
|
|
2917
2952
|
* Destroy toolbar and cleanup
|
|
2918
2953
|
*/
|
|
@@ -2934,6 +2969,1203 @@ var Toolbar = class {
|
|
|
2934
2969
|
}
|
|
2935
2970
|
};
|
|
2936
2971
|
|
|
2972
|
+
// node_modules/@floating-ui/utils/dist/floating-ui.utils.mjs
|
|
2973
|
+
var min = Math.min;
|
|
2974
|
+
var max = Math.max;
|
|
2975
|
+
var round = Math.round;
|
|
2976
|
+
var createCoords = (v) => ({
|
|
2977
|
+
x: v,
|
|
2978
|
+
y: v
|
|
2979
|
+
});
|
|
2980
|
+
var oppositeSideMap = {
|
|
2981
|
+
left: "right",
|
|
2982
|
+
right: "left",
|
|
2983
|
+
bottom: "top",
|
|
2984
|
+
top: "bottom"
|
|
2985
|
+
};
|
|
2986
|
+
var oppositeAlignmentMap = {
|
|
2987
|
+
start: "end",
|
|
2988
|
+
end: "start"
|
|
2989
|
+
};
|
|
2990
|
+
function clamp(start, value, end) {
|
|
2991
|
+
return max(start, min(value, end));
|
|
2992
|
+
}
|
|
2993
|
+
function evaluate(value, param) {
|
|
2994
|
+
return typeof value === "function" ? value(param) : value;
|
|
2995
|
+
}
|
|
2996
|
+
function getSide(placement) {
|
|
2997
|
+
return placement.split("-")[0];
|
|
2998
|
+
}
|
|
2999
|
+
function getAlignment(placement) {
|
|
3000
|
+
return placement.split("-")[1];
|
|
3001
|
+
}
|
|
3002
|
+
function getOppositeAxis(axis) {
|
|
3003
|
+
return axis === "x" ? "y" : "x";
|
|
3004
|
+
}
|
|
3005
|
+
function getAxisLength(axis) {
|
|
3006
|
+
return axis === "y" ? "height" : "width";
|
|
3007
|
+
}
|
|
3008
|
+
var yAxisSides = /* @__PURE__ */ new Set(["top", "bottom"]);
|
|
3009
|
+
function getSideAxis(placement) {
|
|
3010
|
+
return yAxisSides.has(getSide(placement)) ? "y" : "x";
|
|
3011
|
+
}
|
|
3012
|
+
function getAlignmentAxis(placement) {
|
|
3013
|
+
return getOppositeAxis(getSideAxis(placement));
|
|
3014
|
+
}
|
|
3015
|
+
function getAlignmentSides(placement, rects, rtl) {
|
|
3016
|
+
if (rtl === void 0) {
|
|
3017
|
+
rtl = false;
|
|
3018
|
+
}
|
|
3019
|
+
const alignment = getAlignment(placement);
|
|
3020
|
+
const alignmentAxis = getAlignmentAxis(placement);
|
|
3021
|
+
const length = getAxisLength(alignmentAxis);
|
|
3022
|
+
let mainAlignmentSide = alignmentAxis === "x" ? alignment === (rtl ? "end" : "start") ? "right" : "left" : alignment === "start" ? "bottom" : "top";
|
|
3023
|
+
if (rects.reference[length] > rects.floating[length]) {
|
|
3024
|
+
mainAlignmentSide = getOppositePlacement(mainAlignmentSide);
|
|
3025
|
+
}
|
|
3026
|
+
return [mainAlignmentSide, getOppositePlacement(mainAlignmentSide)];
|
|
3027
|
+
}
|
|
3028
|
+
function getExpandedPlacements(placement) {
|
|
3029
|
+
const oppositePlacement = getOppositePlacement(placement);
|
|
3030
|
+
return [getOppositeAlignmentPlacement(placement), oppositePlacement, getOppositeAlignmentPlacement(oppositePlacement)];
|
|
3031
|
+
}
|
|
3032
|
+
function getOppositeAlignmentPlacement(placement) {
|
|
3033
|
+
return placement.replace(/start|end/g, (alignment) => oppositeAlignmentMap[alignment]);
|
|
3034
|
+
}
|
|
3035
|
+
var lrPlacement = ["left", "right"];
|
|
3036
|
+
var rlPlacement = ["right", "left"];
|
|
3037
|
+
var tbPlacement = ["top", "bottom"];
|
|
3038
|
+
var btPlacement = ["bottom", "top"];
|
|
3039
|
+
function getSideList(side, isStart, rtl) {
|
|
3040
|
+
switch (side) {
|
|
3041
|
+
case "top":
|
|
3042
|
+
case "bottom":
|
|
3043
|
+
if (rtl)
|
|
3044
|
+
return isStart ? rlPlacement : lrPlacement;
|
|
3045
|
+
return isStart ? lrPlacement : rlPlacement;
|
|
3046
|
+
case "left":
|
|
3047
|
+
case "right":
|
|
3048
|
+
return isStart ? tbPlacement : btPlacement;
|
|
3049
|
+
default:
|
|
3050
|
+
return [];
|
|
3051
|
+
}
|
|
3052
|
+
}
|
|
3053
|
+
function getOppositeAxisPlacements(placement, flipAlignment, direction, rtl) {
|
|
3054
|
+
const alignment = getAlignment(placement);
|
|
3055
|
+
let list = getSideList(getSide(placement), direction === "start", rtl);
|
|
3056
|
+
if (alignment) {
|
|
3057
|
+
list = list.map((side) => side + "-" + alignment);
|
|
3058
|
+
if (flipAlignment) {
|
|
3059
|
+
list = list.concat(list.map(getOppositeAlignmentPlacement));
|
|
3060
|
+
}
|
|
3061
|
+
}
|
|
3062
|
+
return list;
|
|
3063
|
+
}
|
|
3064
|
+
function getOppositePlacement(placement) {
|
|
3065
|
+
return placement.replace(/left|right|bottom|top/g, (side) => oppositeSideMap[side]);
|
|
3066
|
+
}
|
|
3067
|
+
function expandPaddingObject(padding) {
|
|
3068
|
+
return {
|
|
3069
|
+
top: 0,
|
|
3070
|
+
right: 0,
|
|
3071
|
+
bottom: 0,
|
|
3072
|
+
left: 0,
|
|
3073
|
+
...padding
|
|
3074
|
+
};
|
|
3075
|
+
}
|
|
3076
|
+
function getPaddingObject(padding) {
|
|
3077
|
+
return typeof padding !== "number" ? expandPaddingObject(padding) : {
|
|
3078
|
+
top: padding,
|
|
3079
|
+
right: padding,
|
|
3080
|
+
bottom: padding,
|
|
3081
|
+
left: padding
|
|
3082
|
+
};
|
|
3083
|
+
}
|
|
3084
|
+
function rectToClientRect(rect) {
|
|
3085
|
+
const {
|
|
3086
|
+
x,
|
|
3087
|
+
y,
|
|
3088
|
+
width,
|
|
3089
|
+
height
|
|
3090
|
+
} = rect;
|
|
3091
|
+
return {
|
|
3092
|
+
width,
|
|
3093
|
+
height,
|
|
3094
|
+
top: y,
|
|
3095
|
+
left: x,
|
|
3096
|
+
right: x + width,
|
|
3097
|
+
bottom: y + height,
|
|
3098
|
+
x,
|
|
3099
|
+
y
|
|
3100
|
+
};
|
|
3101
|
+
}
|
|
3102
|
+
|
|
3103
|
+
// node_modules/@floating-ui/core/dist/floating-ui.core.mjs
|
|
3104
|
+
function computeCoordsFromPlacement(_ref, placement, rtl) {
|
|
3105
|
+
let {
|
|
3106
|
+
reference,
|
|
3107
|
+
floating
|
|
3108
|
+
} = _ref;
|
|
3109
|
+
const sideAxis = getSideAxis(placement);
|
|
3110
|
+
const alignmentAxis = getAlignmentAxis(placement);
|
|
3111
|
+
const alignLength = getAxisLength(alignmentAxis);
|
|
3112
|
+
const side = getSide(placement);
|
|
3113
|
+
const isVertical = sideAxis === "y";
|
|
3114
|
+
const commonX = reference.x + reference.width / 2 - floating.width / 2;
|
|
3115
|
+
const commonY = reference.y + reference.height / 2 - floating.height / 2;
|
|
3116
|
+
const commonAlign = reference[alignLength] / 2 - floating[alignLength] / 2;
|
|
3117
|
+
let coords;
|
|
3118
|
+
switch (side) {
|
|
3119
|
+
case "top":
|
|
3120
|
+
coords = {
|
|
3121
|
+
x: commonX,
|
|
3122
|
+
y: reference.y - floating.height
|
|
3123
|
+
};
|
|
3124
|
+
break;
|
|
3125
|
+
case "bottom":
|
|
3126
|
+
coords = {
|
|
3127
|
+
x: commonX,
|
|
3128
|
+
y: reference.y + reference.height
|
|
3129
|
+
};
|
|
3130
|
+
break;
|
|
3131
|
+
case "right":
|
|
3132
|
+
coords = {
|
|
3133
|
+
x: reference.x + reference.width,
|
|
3134
|
+
y: commonY
|
|
3135
|
+
};
|
|
3136
|
+
break;
|
|
3137
|
+
case "left":
|
|
3138
|
+
coords = {
|
|
3139
|
+
x: reference.x - floating.width,
|
|
3140
|
+
y: commonY
|
|
3141
|
+
};
|
|
3142
|
+
break;
|
|
3143
|
+
default:
|
|
3144
|
+
coords = {
|
|
3145
|
+
x: reference.x,
|
|
3146
|
+
y: reference.y
|
|
3147
|
+
};
|
|
3148
|
+
}
|
|
3149
|
+
switch (getAlignment(placement)) {
|
|
3150
|
+
case "start":
|
|
3151
|
+
coords[alignmentAxis] -= commonAlign * (rtl && isVertical ? -1 : 1);
|
|
3152
|
+
break;
|
|
3153
|
+
case "end":
|
|
3154
|
+
coords[alignmentAxis] += commonAlign * (rtl && isVertical ? -1 : 1);
|
|
3155
|
+
break;
|
|
3156
|
+
}
|
|
3157
|
+
return coords;
|
|
3158
|
+
}
|
|
3159
|
+
async function detectOverflow(state, options) {
|
|
3160
|
+
var _await$platform$isEle;
|
|
3161
|
+
if (options === void 0) {
|
|
3162
|
+
options = {};
|
|
3163
|
+
}
|
|
3164
|
+
const {
|
|
3165
|
+
x,
|
|
3166
|
+
y,
|
|
3167
|
+
platform: platform2,
|
|
3168
|
+
rects,
|
|
3169
|
+
elements,
|
|
3170
|
+
strategy
|
|
3171
|
+
} = state;
|
|
3172
|
+
const {
|
|
3173
|
+
boundary = "clippingAncestors",
|
|
3174
|
+
rootBoundary = "viewport",
|
|
3175
|
+
elementContext = "floating",
|
|
3176
|
+
altBoundary = false,
|
|
3177
|
+
padding = 0
|
|
3178
|
+
} = evaluate(options, state);
|
|
3179
|
+
const paddingObject = getPaddingObject(padding);
|
|
3180
|
+
const altContext = elementContext === "floating" ? "reference" : "floating";
|
|
3181
|
+
const element = elements[altBoundary ? altContext : elementContext];
|
|
3182
|
+
const clippingClientRect = rectToClientRect(await platform2.getClippingRect({
|
|
3183
|
+
element: ((_await$platform$isEle = await (platform2.isElement == null ? void 0 : platform2.isElement(element))) != null ? _await$platform$isEle : true) ? element : element.contextElement || await (platform2.getDocumentElement == null ? void 0 : platform2.getDocumentElement(elements.floating)),
|
|
3184
|
+
boundary,
|
|
3185
|
+
rootBoundary,
|
|
3186
|
+
strategy
|
|
3187
|
+
}));
|
|
3188
|
+
const rect = elementContext === "floating" ? {
|
|
3189
|
+
x,
|
|
3190
|
+
y,
|
|
3191
|
+
width: rects.floating.width,
|
|
3192
|
+
height: rects.floating.height
|
|
3193
|
+
} : rects.reference;
|
|
3194
|
+
const offsetParent = await (platform2.getOffsetParent == null ? void 0 : platform2.getOffsetParent(elements.floating));
|
|
3195
|
+
const offsetScale = await (platform2.isElement == null ? void 0 : platform2.isElement(offsetParent)) ? await (platform2.getScale == null ? void 0 : platform2.getScale(offsetParent)) || {
|
|
3196
|
+
x: 1,
|
|
3197
|
+
y: 1
|
|
3198
|
+
} : {
|
|
3199
|
+
x: 1,
|
|
3200
|
+
y: 1
|
|
3201
|
+
};
|
|
3202
|
+
const elementClientRect = rectToClientRect(platform2.convertOffsetParentRelativeRectToViewportRelativeRect ? await platform2.convertOffsetParentRelativeRectToViewportRelativeRect({
|
|
3203
|
+
elements,
|
|
3204
|
+
rect,
|
|
3205
|
+
offsetParent,
|
|
3206
|
+
strategy
|
|
3207
|
+
}) : rect);
|
|
3208
|
+
return {
|
|
3209
|
+
top: (clippingClientRect.top - elementClientRect.top + paddingObject.top) / offsetScale.y,
|
|
3210
|
+
bottom: (elementClientRect.bottom - clippingClientRect.bottom + paddingObject.bottom) / offsetScale.y,
|
|
3211
|
+
left: (clippingClientRect.left - elementClientRect.left + paddingObject.left) / offsetScale.x,
|
|
3212
|
+
right: (elementClientRect.right - clippingClientRect.right + paddingObject.right) / offsetScale.x
|
|
3213
|
+
};
|
|
3214
|
+
}
|
|
3215
|
+
var computePosition = async (reference, floating, config) => {
|
|
3216
|
+
const {
|
|
3217
|
+
placement = "bottom",
|
|
3218
|
+
strategy = "absolute",
|
|
3219
|
+
middleware = [],
|
|
3220
|
+
platform: platform2
|
|
3221
|
+
} = config;
|
|
3222
|
+
const validMiddleware = middleware.filter(Boolean);
|
|
3223
|
+
const rtl = await (platform2.isRTL == null ? void 0 : platform2.isRTL(floating));
|
|
3224
|
+
let rects = await platform2.getElementRects({
|
|
3225
|
+
reference,
|
|
3226
|
+
floating,
|
|
3227
|
+
strategy
|
|
3228
|
+
});
|
|
3229
|
+
let {
|
|
3230
|
+
x,
|
|
3231
|
+
y
|
|
3232
|
+
} = computeCoordsFromPlacement(rects, placement, rtl);
|
|
3233
|
+
let statefulPlacement = placement;
|
|
3234
|
+
let middlewareData = {};
|
|
3235
|
+
let resetCount = 0;
|
|
3236
|
+
for (let i = 0; i < validMiddleware.length; i++) {
|
|
3237
|
+
var _platform$detectOverf;
|
|
3238
|
+
const {
|
|
3239
|
+
name,
|
|
3240
|
+
fn
|
|
3241
|
+
} = validMiddleware[i];
|
|
3242
|
+
const {
|
|
3243
|
+
x: nextX,
|
|
3244
|
+
y: nextY,
|
|
3245
|
+
data,
|
|
3246
|
+
reset
|
|
3247
|
+
} = await fn({
|
|
3248
|
+
x,
|
|
3249
|
+
y,
|
|
3250
|
+
initialPlacement: placement,
|
|
3251
|
+
placement: statefulPlacement,
|
|
3252
|
+
strategy,
|
|
3253
|
+
middlewareData,
|
|
3254
|
+
rects,
|
|
3255
|
+
platform: {
|
|
3256
|
+
...platform2,
|
|
3257
|
+
detectOverflow: (_platform$detectOverf = platform2.detectOverflow) != null ? _platform$detectOverf : detectOverflow
|
|
3258
|
+
},
|
|
3259
|
+
elements: {
|
|
3260
|
+
reference,
|
|
3261
|
+
floating
|
|
3262
|
+
}
|
|
3263
|
+
});
|
|
3264
|
+
x = nextX != null ? nextX : x;
|
|
3265
|
+
y = nextY != null ? nextY : y;
|
|
3266
|
+
middlewareData = {
|
|
3267
|
+
...middlewareData,
|
|
3268
|
+
[name]: {
|
|
3269
|
+
...middlewareData[name],
|
|
3270
|
+
...data
|
|
3271
|
+
}
|
|
3272
|
+
};
|
|
3273
|
+
if (reset && resetCount <= 50) {
|
|
3274
|
+
resetCount++;
|
|
3275
|
+
if (typeof reset === "object") {
|
|
3276
|
+
if (reset.placement) {
|
|
3277
|
+
statefulPlacement = reset.placement;
|
|
3278
|
+
}
|
|
3279
|
+
if (reset.rects) {
|
|
3280
|
+
rects = reset.rects === true ? await platform2.getElementRects({
|
|
3281
|
+
reference,
|
|
3282
|
+
floating,
|
|
3283
|
+
strategy
|
|
3284
|
+
}) : reset.rects;
|
|
3285
|
+
}
|
|
3286
|
+
({
|
|
3287
|
+
x,
|
|
3288
|
+
y
|
|
3289
|
+
} = computeCoordsFromPlacement(rects, statefulPlacement, rtl));
|
|
3290
|
+
}
|
|
3291
|
+
i = -1;
|
|
3292
|
+
}
|
|
3293
|
+
}
|
|
3294
|
+
return {
|
|
3295
|
+
x,
|
|
3296
|
+
y,
|
|
3297
|
+
placement: statefulPlacement,
|
|
3298
|
+
strategy,
|
|
3299
|
+
middlewareData
|
|
3300
|
+
};
|
|
3301
|
+
};
|
|
3302
|
+
var flip = function(options) {
|
|
3303
|
+
if (options === void 0) {
|
|
3304
|
+
options = {};
|
|
3305
|
+
}
|
|
3306
|
+
return {
|
|
3307
|
+
name: "flip",
|
|
3308
|
+
options,
|
|
3309
|
+
async fn(state) {
|
|
3310
|
+
var _middlewareData$arrow, _middlewareData$flip;
|
|
3311
|
+
const {
|
|
3312
|
+
placement,
|
|
3313
|
+
middlewareData,
|
|
3314
|
+
rects,
|
|
3315
|
+
initialPlacement,
|
|
3316
|
+
platform: platform2,
|
|
3317
|
+
elements
|
|
3318
|
+
} = state;
|
|
3319
|
+
const {
|
|
3320
|
+
mainAxis: checkMainAxis = true,
|
|
3321
|
+
crossAxis: checkCrossAxis = true,
|
|
3322
|
+
fallbackPlacements: specifiedFallbackPlacements,
|
|
3323
|
+
fallbackStrategy = "bestFit",
|
|
3324
|
+
fallbackAxisSideDirection = "none",
|
|
3325
|
+
flipAlignment = true,
|
|
3326
|
+
...detectOverflowOptions
|
|
3327
|
+
} = evaluate(options, state);
|
|
3328
|
+
if ((_middlewareData$arrow = middlewareData.arrow) != null && _middlewareData$arrow.alignmentOffset) {
|
|
3329
|
+
return {};
|
|
3330
|
+
}
|
|
3331
|
+
const side = getSide(placement);
|
|
3332
|
+
const initialSideAxis = getSideAxis(initialPlacement);
|
|
3333
|
+
const isBasePlacement = getSide(initialPlacement) === initialPlacement;
|
|
3334
|
+
const rtl = await (platform2.isRTL == null ? void 0 : platform2.isRTL(elements.floating));
|
|
3335
|
+
const fallbackPlacements = specifiedFallbackPlacements || (isBasePlacement || !flipAlignment ? [getOppositePlacement(initialPlacement)] : getExpandedPlacements(initialPlacement));
|
|
3336
|
+
const hasFallbackAxisSideDirection = fallbackAxisSideDirection !== "none";
|
|
3337
|
+
if (!specifiedFallbackPlacements && hasFallbackAxisSideDirection) {
|
|
3338
|
+
fallbackPlacements.push(...getOppositeAxisPlacements(initialPlacement, flipAlignment, fallbackAxisSideDirection, rtl));
|
|
3339
|
+
}
|
|
3340
|
+
const placements2 = [initialPlacement, ...fallbackPlacements];
|
|
3341
|
+
const overflow = await platform2.detectOverflow(state, detectOverflowOptions);
|
|
3342
|
+
const overflows = [];
|
|
3343
|
+
let overflowsData = ((_middlewareData$flip = middlewareData.flip) == null ? void 0 : _middlewareData$flip.overflows) || [];
|
|
3344
|
+
if (checkMainAxis) {
|
|
3345
|
+
overflows.push(overflow[side]);
|
|
3346
|
+
}
|
|
3347
|
+
if (checkCrossAxis) {
|
|
3348
|
+
const sides2 = getAlignmentSides(placement, rects, rtl);
|
|
3349
|
+
overflows.push(overflow[sides2[0]], overflow[sides2[1]]);
|
|
3350
|
+
}
|
|
3351
|
+
overflowsData = [...overflowsData, {
|
|
3352
|
+
placement,
|
|
3353
|
+
overflows
|
|
3354
|
+
}];
|
|
3355
|
+
if (!overflows.every((side2) => side2 <= 0)) {
|
|
3356
|
+
var _middlewareData$flip2, _overflowsData$filter;
|
|
3357
|
+
const nextIndex = (((_middlewareData$flip2 = middlewareData.flip) == null ? void 0 : _middlewareData$flip2.index) || 0) + 1;
|
|
3358
|
+
const nextPlacement = placements2[nextIndex];
|
|
3359
|
+
if (nextPlacement) {
|
|
3360
|
+
const ignoreCrossAxisOverflow = checkCrossAxis === "alignment" ? initialSideAxis !== getSideAxis(nextPlacement) : false;
|
|
3361
|
+
if (!ignoreCrossAxisOverflow || // We leave the current main axis only if every placement on that axis
|
|
3362
|
+
// overflows the main axis.
|
|
3363
|
+
overflowsData.every((d) => getSideAxis(d.placement) === initialSideAxis ? d.overflows[0] > 0 : true)) {
|
|
3364
|
+
return {
|
|
3365
|
+
data: {
|
|
3366
|
+
index: nextIndex,
|
|
3367
|
+
overflows: overflowsData
|
|
3368
|
+
},
|
|
3369
|
+
reset: {
|
|
3370
|
+
placement: nextPlacement
|
|
3371
|
+
}
|
|
3372
|
+
};
|
|
3373
|
+
}
|
|
3374
|
+
}
|
|
3375
|
+
let resetPlacement = (_overflowsData$filter = overflowsData.filter((d) => d.overflows[0] <= 0).sort((a, b) => a.overflows[1] - b.overflows[1])[0]) == null ? void 0 : _overflowsData$filter.placement;
|
|
3376
|
+
if (!resetPlacement) {
|
|
3377
|
+
switch (fallbackStrategy) {
|
|
3378
|
+
case "bestFit": {
|
|
3379
|
+
var _overflowsData$filter2;
|
|
3380
|
+
const placement2 = (_overflowsData$filter2 = overflowsData.filter((d) => {
|
|
3381
|
+
if (hasFallbackAxisSideDirection) {
|
|
3382
|
+
const currentSideAxis = getSideAxis(d.placement);
|
|
3383
|
+
return currentSideAxis === initialSideAxis || // Create a bias to the `y` side axis due to horizontal
|
|
3384
|
+
// reading directions favoring greater width.
|
|
3385
|
+
currentSideAxis === "y";
|
|
3386
|
+
}
|
|
3387
|
+
return true;
|
|
3388
|
+
}).map((d) => [d.placement, d.overflows.filter((overflow2) => overflow2 > 0).reduce((acc, overflow2) => acc + overflow2, 0)]).sort((a, b) => a[1] - b[1])[0]) == null ? void 0 : _overflowsData$filter2[0];
|
|
3389
|
+
if (placement2) {
|
|
3390
|
+
resetPlacement = placement2;
|
|
3391
|
+
}
|
|
3392
|
+
break;
|
|
3393
|
+
}
|
|
3394
|
+
case "initialPlacement":
|
|
3395
|
+
resetPlacement = initialPlacement;
|
|
3396
|
+
break;
|
|
3397
|
+
}
|
|
3398
|
+
}
|
|
3399
|
+
if (placement !== resetPlacement) {
|
|
3400
|
+
return {
|
|
3401
|
+
reset: {
|
|
3402
|
+
placement: resetPlacement
|
|
3403
|
+
}
|
|
3404
|
+
};
|
|
3405
|
+
}
|
|
3406
|
+
}
|
|
3407
|
+
return {};
|
|
3408
|
+
}
|
|
3409
|
+
};
|
|
3410
|
+
};
|
|
3411
|
+
var originSides = /* @__PURE__ */ new Set(["left", "top"]);
|
|
3412
|
+
async function convertValueToCoords(state, options) {
|
|
3413
|
+
const {
|
|
3414
|
+
placement,
|
|
3415
|
+
platform: platform2,
|
|
3416
|
+
elements
|
|
3417
|
+
} = state;
|
|
3418
|
+
const rtl = await (platform2.isRTL == null ? void 0 : platform2.isRTL(elements.floating));
|
|
3419
|
+
const side = getSide(placement);
|
|
3420
|
+
const alignment = getAlignment(placement);
|
|
3421
|
+
const isVertical = getSideAxis(placement) === "y";
|
|
3422
|
+
const mainAxisMulti = originSides.has(side) ? -1 : 1;
|
|
3423
|
+
const crossAxisMulti = rtl && isVertical ? -1 : 1;
|
|
3424
|
+
const rawValue = evaluate(options, state);
|
|
3425
|
+
let {
|
|
3426
|
+
mainAxis,
|
|
3427
|
+
crossAxis,
|
|
3428
|
+
alignmentAxis
|
|
3429
|
+
} = typeof rawValue === "number" ? {
|
|
3430
|
+
mainAxis: rawValue,
|
|
3431
|
+
crossAxis: 0,
|
|
3432
|
+
alignmentAxis: null
|
|
3433
|
+
} : {
|
|
3434
|
+
mainAxis: rawValue.mainAxis || 0,
|
|
3435
|
+
crossAxis: rawValue.crossAxis || 0,
|
|
3436
|
+
alignmentAxis: rawValue.alignmentAxis
|
|
3437
|
+
};
|
|
3438
|
+
if (alignment && typeof alignmentAxis === "number") {
|
|
3439
|
+
crossAxis = alignment === "end" ? alignmentAxis * -1 : alignmentAxis;
|
|
3440
|
+
}
|
|
3441
|
+
return isVertical ? {
|
|
3442
|
+
x: crossAxis * crossAxisMulti,
|
|
3443
|
+
y: mainAxis * mainAxisMulti
|
|
3444
|
+
} : {
|
|
3445
|
+
x: mainAxis * mainAxisMulti,
|
|
3446
|
+
y: crossAxis * crossAxisMulti
|
|
3447
|
+
};
|
|
3448
|
+
}
|
|
3449
|
+
var offset = function(options) {
|
|
3450
|
+
if (options === void 0) {
|
|
3451
|
+
options = 0;
|
|
3452
|
+
}
|
|
3453
|
+
return {
|
|
3454
|
+
name: "offset",
|
|
3455
|
+
options,
|
|
3456
|
+
async fn(state) {
|
|
3457
|
+
var _middlewareData$offse, _middlewareData$arrow;
|
|
3458
|
+
const {
|
|
3459
|
+
x,
|
|
3460
|
+
y,
|
|
3461
|
+
placement,
|
|
3462
|
+
middlewareData
|
|
3463
|
+
} = state;
|
|
3464
|
+
const diffCoords = await convertValueToCoords(state, options);
|
|
3465
|
+
if (placement === ((_middlewareData$offse = middlewareData.offset) == null ? void 0 : _middlewareData$offse.placement) && (_middlewareData$arrow = middlewareData.arrow) != null && _middlewareData$arrow.alignmentOffset) {
|
|
3466
|
+
return {};
|
|
3467
|
+
}
|
|
3468
|
+
return {
|
|
3469
|
+
x: x + diffCoords.x,
|
|
3470
|
+
y: y + diffCoords.y,
|
|
3471
|
+
data: {
|
|
3472
|
+
...diffCoords,
|
|
3473
|
+
placement
|
|
3474
|
+
}
|
|
3475
|
+
};
|
|
3476
|
+
}
|
|
3477
|
+
};
|
|
3478
|
+
};
|
|
3479
|
+
var shift = function(options) {
|
|
3480
|
+
if (options === void 0) {
|
|
3481
|
+
options = {};
|
|
3482
|
+
}
|
|
3483
|
+
return {
|
|
3484
|
+
name: "shift",
|
|
3485
|
+
options,
|
|
3486
|
+
async fn(state) {
|
|
3487
|
+
const {
|
|
3488
|
+
x,
|
|
3489
|
+
y,
|
|
3490
|
+
placement,
|
|
3491
|
+
platform: platform2
|
|
3492
|
+
} = state;
|
|
3493
|
+
const {
|
|
3494
|
+
mainAxis: checkMainAxis = true,
|
|
3495
|
+
crossAxis: checkCrossAxis = false,
|
|
3496
|
+
limiter = {
|
|
3497
|
+
fn: (_ref) => {
|
|
3498
|
+
let {
|
|
3499
|
+
x: x2,
|
|
3500
|
+
y: y2
|
|
3501
|
+
} = _ref;
|
|
3502
|
+
return {
|
|
3503
|
+
x: x2,
|
|
3504
|
+
y: y2
|
|
3505
|
+
};
|
|
3506
|
+
}
|
|
3507
|
+
},
|
|
3508
|
+
...detectOverflowOptions
|
|
3509
|
+
} = evaluate(options, state);
|
|
3510
|
+
const coords = {
|
|
3511
|
+
x,
|
|
3512
|
+
y
|
|
3513
|
+
};
|
|
3514
|
+
const overflow = await platform2.detectOverflow(state, detectOverflowOptions);
|
|
3515
|
+
const crossAxis = getSideAxis(getSide(placement));
|
|
3516
|
+
const mainAxis = getOppositeAxis(crossAxis);
|
|
3517
|
+
let mainAxisCoord = coords[mainAxis];
|
|
3518
|
+
let crossAxisCoord = coords[crossAxis];
|
|
3519
|
+
if (checkMainAxis) {
|
|
3520
|
+
const minSide = mainAxis === "y" ? "top" : "left";
|
|
3521
|
+
const maxSide = mainAxis === "y" ? "bottom" : "right";
|
|
3522
|
+
const min2 = mainAxisCoord + overflow[minSide];
|
|
3523
|
+
const max2 = mainAxisCoord - overflow[maxSide];
|
|
3524
|
+
mainAxisCoord = clamp(min2, mainAxisCoord, max2);
|
|
3525
|
+
}
|
|
3526
|
+
if (checkCrossAxis) {
|
|
3527
|
+
const minSide = crossAxis === "y" ? "top" : "left";
|
|
3528
|
+
const maxSide = crossAxis === "y" ? "bottom" : "right";
|
|
3529
|
+
const min2 = crossAxisCoord + overflow[minSide];
|
|
3530
|
+
const max2 = crossAxisCoord - overflow[maxSide];
|
|
3531
|
+
crossAxisCoord = clamp(min2, crossAxisCoord, max2);
|
|
3532
|
+
}
|
|
3533
|
+
const limitedCoords = limiter.fn({
|
|
3534
|
+
...state,
|
|
3535
|
+
[mainAxis]: mainAxisCoord,
|
|
3536
|
+
[crossAxis]: crossAxisCoord
|
|
3537
|
+
});
|
|
3538
|
+
return {
|
|
3539
|
+
...limitedCoords,
|
|
3540
|
+
data: {
|
|
3541
|
+
x: limitedCoords.x - x,
|
|
3542
|
+
y: limitedCoords.y - y,
|
|
3543
|
+
enabled: {
|
|
3544
|
+
[mainAxis]: checkMainAxis,
|
|
3545
|
+
[crossAxis]: checkCrossAxis
|
|
3546
|
+
}
|
|
3547
|
+
}
|
|
3548
|
+
};
|
|
3549
|
+
}
|
|
3550
|
+
};
|
|
3551
|
+
};
|
|
3552
|
+
|
|
3553
|
+
// node_modules/@floating-ui/utils/dist/floating-ui.utils.dom.mjs
|
|
3554
|
+
function hasWindow() {
|
|
3555
|
+
return typeof window !== "undefined";
|
|
3556
|
+
}
|
|
3557
|
+
function getNodeName(node) {
|
|
3558
|
+
if (isNode(node)) {
|
|
3559
|
+
return (node.nodeName || "").toLowerCase();
|
|
3560
|
+
}
|
|
3561
|
+
return "#document";
|
|
3562
|
+
}
|
|
3563
|
+
function getWindow(node) {
|
|
3564
|
+
var _node$ownerDocument;
|
|
3565
|
+
return (node == null || (_node$ownerDocument = node.ownerDocument) == null ? void 0 : _node$ownerDocument.defaultView) || window;
|
|
3566
|
+
}
|
|
3567
|
+
function getDocumentElement(node) {
|
|
3568
|
+
var _ref;
|
|
3569
|
+
return (_ref = (isNode(node) ? node.ownerDocument : node.document) || window.document) == null ? void 0 : _ref.documentElement;
|
|
3570
|
+
}
|
|
3571
|
+
function isNode(value) {
|
|
3572
|
+
if (!hasWindow()) {
|
|
3573
|
+
return false;
|
|
3574
|
+
}
|
|
3575
|
+
return value instanceof Node || value instanceof getWindow(value).Node;
|
|
3576
|
+
}
|
|
3577
|
+
function isElement(value) {
|
|
3578
|
+
if (!hasWindow()) {
|
|
3579
|
+
return false;
|
|
3580
|
+
}
|
|
3581
|
+
return value instanceof Element || value instanceof getWindow(value).Element;
|
|
3582
|
+
}
|
|
3583
|
+
function isHTMLElement(value) {
|
|
3584
|
+
if (!hasWindow()) {
|
|
3585
|
+
return false;
|
|
3586
|
+
}
|
|
3587
|
+
return value instanceof HTMLElement || value instanceof getWindow(value).HTMLElement;
|
|
3588
|
+
}
|
|
3589
|
+
function isShadowRoot(value) {
|
|
3590
|
+
if (!hasWindow() || typeof ShadowRoot === "undefined") {
|
|
3591
|
+
return false;
|
|
3592
|
+
}
|
|
3593
|
+
return value instanceof ShadowRoot || value instanceof getWindow(value).ShadowRoot;
|
|
3594
|
+
}
|
|
3595
|
+
var invalidOverflowDisplayValues = /* @__PURE__ */ new Set(["inline", "contents"]);
|
|
3596
|
+
function isOverflowElement(element) {
|
|
3597
|
+
const {
|
|
3598
|
+
overflow,
|
|
3599
|
+
overflowX,
|
|
3600
|
+
overflowY,
|
|
3601
|
+
display
|
|
3602
|
+
} = getComputedStyle2(element);
|
|
3603
|
+
return /auto|scroll|overlay|hidden|clip/.test(overflow + overflowY + overflowX) && !invalidOverflowDisplayValues.has(display);
|
|
3604
|
+
}
|
|
3605
|
+
var tableElements = /* @__PURE__ */ new Set(["table", "td", "th"]);
|
|
3606
|
+
function isTableElement(element) {
|
|
3607
|
+
return tableElements.has(getNodeName(element));
|
|
3608
|
+
}
|
|
3609
|
+
var topLayerSelectors = [":popover-open", ":modal"];
|
|
3610
|
+
function isTopLayer(element) {
|
|
3611
|
+
return topLayerSelectors.some((selector) => {
|
|
3612
|
+
try {
|
|
3613
|
+
return element.matches(selector);
|
|
3614
|
+
} catch (_e) {
|
|
3615
|
+
return false;
|
|
3616
|
+
}
|
|
3617
|
+
});
|
|
3618
|
+
}
|
|
3619
|
+
var transformProperties = ["transform", "translate", "scale", "rotate", "perspective"];
|
|
3620
|
+
var willChangeValues = ["transform", "translate", "scale", "rotate", "perspective", "filter"];
|
|
3621
|
+
var containValues = ["paint", "layout", "strict", "content"];
|
|
3622
|
+
function isContainingBlock(elementOrCss) {
|
|
3623
|
+
const webkit = isWebKit();
|
|
3624
|
+
const css = isElement(elementOrCss) ? getComputedStyle2(elementOrCss) : elementOrCss;
|
|
3625
|
+
return transformProperties.some((value) => css[value] ? css[value] !== "none" : false) || (css.containerType ? css.containerType !== "normal" : false) || !webkit && (css.backdropFilter ? css.backdropFilter !== "none" : false) || !webkit && (css.filter ? css.filter !== "none" : false) || willChangeValues.some((value) => (css.willChange || "").includes(value)) || containValues.some((value) => (css.contain || "").includes(value));
|
|
3626
|
+
}
|
|
3627
|
+
function getContainingBlock(element) {
|
|
3628
|
+
let currentNode = getParentNode(element);
|
|
3629
|
+
while (isHTMLElement(currentNode) && !isLastTraversableNode(currentNode)) {
|
|
3630
|
+
if (isContainingBlock(currentNode)) {
|
|
3631
|
+
return currentNode;
|
|
3632
|
+
} else if (isTopLayer(currentNode)) {
|
|
3633
|
+
return null;
|
|
3634
|
+
}
|
|
3635
|
+
currentNode = getParentNode(currentNode);
|
|
3636
|
+
}
|
|
3637
|
+
return null;
|
|
3638
|
+
}
|
|
3639
|
+
function isWebKit() {
|
|
3640
|
+
if (typeof CSS === "undefined" || !CSS.supports)
|
|
3641
|
+
return false;
|
|
3642
|
+
return CSS.supports("-webkit-backdrop-filter", "none");
|
|
3643
|
+
}
|
|
3644
|
+
var lastTraversableNodeNames = /* @__PURE__ */ new Set(["html", "body", "#document"]);
|
|
3645
|
+
function isLastTraversableNode(node) {
|
|
3646
|
+
return lastTraversableNodeNames.has(getNodeName(node));
|
|
3647
|
+
}
|
|
3648
|
+
function getComputedStyle2(element) {
|
|
3649
|
+
return getWindow(element).getComputedStyle(element);
|
|
3650
|
+
}
|
|
3651
|
+
function getNodeScroll(element) {
|
|
3652
|
+
if (isElement(element)) {
|
|
3653
|
+
return {
|
|
3654
|
+
scrollLeft: element.scrollLeft,
|
|
3655
|
+
scrollTop: element.scrollTop
|
|
3656
|
+
};
|
|
3657
|
+
}
|
|
3658
|
+
return {
|
|
3659
|
+
scrollLeft: element.scrollX,
|
|
3660
|
+
scrollTop: element.scrollY
|
|
3661
|
+
};
|
|
3662
|
+
}
|
|
3663
|
+
function getParentNode(node) {
|
|
3664
|
+
if (getNodeName(node) === "html") {
|
|
3665
|
+
return node;
|
|
3666
|
+
}
|
|
3667
|
+
const result = (
|
|
3668
|
+
// Step into the shadow DOM of the parent of a slotted node.
|
|
3669
|
+
node.assignedSlot || // DOM Element detected.
|
|
3670
|
+
node.parentNode || // ShadowRoot detected.
|
|
3671
|
+
isShadowRoot(node) && node.host || // Fallback.
|
|
3672
|
+
getDocumentElement(node)
|
|
3673
|
+
);
|
|
3674
|
+
return isShadowRoot(result) ? result.host : result;
|
|
3675
|
+
}
|
|
3676
|
+
function getNearestOverflowAncestor(node) {
|
|
3677
|
+
const parentNode = getParentNode(node);
|
|
3678
|
+
if (isLastTraversableNode(parentNode)) {
|
|
3679
|
+
return node.ownerDocument ? node.ownerDocument.body : node.body;
|
|
3680
|
+
}
|
|
3681
|
+
if (isHTMLElement(parentNode) && isOverflowElement(parentNode)) {
|
|
3682
|
+
return parentNode;
|
|
3683
|
+
}
|
|
3684
|
+
return getNearestOverflowAncestor(parentNode);
|
|
3685
|
+
}
|
|
3686
|
+
function getOverflowAncestors(node, list, traverseIframes) {
|
|
3687
|
+
var _node$ownerDocument2;
|
|
3688
|
+
if (list === void 0) {
|
|
3689
|
+
list = [];
|
|
3690
|
+
}
|
|
3691
|
+
if (traverseIframes === void 0) {
|
|
3692
|
+
traverseIframes = true;
|
|
3693
|
+
}
|
|
3694
|
+
const scrollableAncestor = getNearestOverflowAncestor(node);
|
|
3695
|
+
const isBody = scrollableAncestor === ((_node$ownerDocument2 = node.ownerDocument) == null ? void 0 : _node$ownerDocument2.body);
|
|
3696
|
+
const win = getWindow(scrollableAncestor);
|
|
3697
|
+
if (isBody) {
|
|
3698
|
+
const frameElement = getFrameElement(win);
|
|
3699
|
+
return list.concat(win, win.visualViewport || [], isOverflowElement(scrollableAncestor) ? scrollableAncestor : [], frameElement && traverseIframes ? getOverflowAncestors(frameElement) : []);
|
|
3700
|
+
}
|
|
3701
|
+
return list.concat(scrollableAncestor, getOverflowAncestors(scrollableAncestor, [], traverseIframes));
|
|
3702
|
+
}
|
|
3703
|
+
function getFrameElement(win) {
|
|
3704
|
+
return win.parent && Object.getPrototypeOf(win.parent) ? win.frameElement : null;
|
|
3705
|
+
}
|
|
3706
|
+
|
|
3707
|
+
// node_modules/@floating-ui/dom/dist/floating-ui.dom.mjs
|
|
3708
|
+
function getCssDimensions(element) {
|
|
3709
|
+
const css = getComputedStyle2(element);
|
|
3710
|
+
let width = parseFloat(css.width) || 0;
|
|
3711
|
+
let height = parseFloat(css.height) || 0;
|
|
3712
|
+
const hasOffset = isHTMLElement(element);
|
|
3713
|
+
const offsetWidth = hasOffset ? element.offsetWidth : width;
|
|
3714
|
+
const offsetHeight = hasOffset ? element.offsetHeight : height;
|
|
3715
|
+
const shouldFallback = round(width) !== offsetWidth || round(height) !== offsetHeight;
|
|
3716
|
+
if (shouldFallback) {
|
|
3717
|
+
width = offsetWidth;
|
|
3718
|
+
height = offsetHeight;
|
|
3719
|
+
}
|
|
3720
|
+
return {
|
|
3721
|
+
width,
|
|
3722
|
+
height,
|
|
3723
|
+
$: shouldFallback
|
|
3724
|
+
};
|
|
3725
|
+
}
|
|
3726
|
+
function unwrapElement(element) {
|
|
3727
|
+
return !isElement(element) ? element.contextElement : element;
|
|
3728
|
+
}
|
|
3729
|
+
function getScale(element) {
|
|
3730
|
+
const domElement = unwrapElement(element);
|
|
3731
|
+
if (!isHTMLElement(domElement)) {
|
|
3732
|
+
return createCoords(1);
|
|
3733
|
+
}
|
|
3734
|
+
const rect = domElement.getBoundingClientRect();
|
|
3735
|
+
const {
|
|
3736
|
+
width,
|
|
3737
|
+
height,
|
|
3738
|
+
$
|
|
3739
|
+
} = getCssDimensions(domElement);
|
|
3740
|
+
let x = ($ ? round(rect.width) : rect.width) / width;
|
|
3741
|
+
let y = ($ ? round(rect.height) : rect.height) / height;
|
|
3742
|
+
if (!x || !Number.isFinite(x)) {
|
|
3743
|
+
x = 1;
|
|
3744
|
+
}
|
|
3745
|
+
if (!y || !Number.isFinite(y)) {
|
|
3746
|
+
y = 1;
|
|
3747
|
+
}
|
|
3748
|
+
return {
|
|
3749
|
+
x,
|
|
3750
|
+
y
|
|
3751
|
+
};
|
|
3752
|
+
}
|
|
3753
|
+
var noOffsets = /* @__PURE__ */ createCoords(0);
|
|
3754
|
+
function getVisualOffsets(element) {
|
|
3755
|
+
const win = getWindow(element);
|
|
3756
|
+
if (!isWebKit() || !win.visualViewport) {
|
|
3757
|
+
return noOffsets;
|
|
3758
|
+
}
|
|
3759
|
+
return {
|
|
3760
|
+
x: win.visualViewport.offsetLeft,
|
|
3761
|
+
y: win.visualViewport.offsetTop
|
|
3762
|
+
};
|
|
3763
|
+
}
|
|
3764
|
+
function shouldAddVisualOffsets(element, isFixed, floatingOffsetParent) {
|
|
3765
|
+
if (isFixed === void 0) {
|
|
3766
|
+
isFixed = false;
|
|
3767
|
+
}
|
|
3768
|
+
if (!floatingOffsetParent || isFixed && floatingOffsetParent !== getWindow(element)) {
|
|
3769
|
+
return false;
|
|
3770
|
+
}
|
|
3771
|
+
return isFixed;
|
|
3772
|
+
}
|
|
3773
|
+
function getBoundingClientRect(element, includeScale, isFixedStrategy, offsetParent) {
|
|
3774
|
+
if (includeScale === void 0) {
|
|
3775
|
+
includeScale = false;
|
|
3776
|
+
}
|
|
3777
|
+
if (isFixedStrategy === void 0) {
|
|
3778
|
+
isFixedStrategy = false;
|
|
3779
|
+
}
|
|
3780
|
+
const clientRect = element.getBoundingClientRect();
|
|
3781
|
+
const domElement = unwrapElement(element);
|
|
3782
|
+
let scale = createCoords(1);
|
|
3783
|
+
if (includeScale) {
|
|
3784
|
+
if (offsetParent) {
|
|
3785
|
+
if (isElement(offsetParent)) {
|
|
3786
|
+
scale = getScale(offsetParent);
|
|
3787
|
+
}
|
|
3788
|
+
} else {
|
|
3789
|
+
scale = getScale(element);
|
|
3790
|
+
}
|
|
3791
|
+
}
|
|
3792
|
+
const visualOffsets = shouldAddVisualOffsets(domElement, isFixedStrategy, offsetParent) ? getVisualOffsets(domElement) : createCoords(0);
|
|
3793
|
+
let x = (clientRect.left + visualOffsets.x) / scale.x;
|
|
3794
|
+
let y = (clientRect.top + visualOffsets.y) / scale.y;
|
|
3795
|
+
let width = clientRect.width / scale.x;
|
|
3796
|
+
let height = clientRect.height / scale.y;
|
|
3797
|
+
if (domElement) {
|
|
3798
|
+
const win = getWindow(domElement);
|
|
3799
|
+
const offsetWin = offsetParent && isElement(offsetParent) ? getWindow(offsetParent) : offsetParent;
|
|
3800
|
+
let currentWin = win;
|
|
3801
|
+
let currentIFrame = getFrameElement(currentWin);
|
|
3802
|
+
while (currentIFrame && offsetParent && offsetWin !== currentWin) {
|
|
3803
|
+
const iframeScale = getScale(currentIFrame);
|
|
3804
|
+
const iframeRect = currentIFrame.getBoundingClientRect();
|
|
3805
|
+
const css = getComputedStyle2(currentIFrame);
|
|
3806
|
+
const left = iframeRect.left + (currentIFrame.clientLeft + parseFloat(css.paddingLeft)) * iframeScale.x;
|
|
3807
|
+
const top = iframeRect.top + (currentIFrame.clientTop + parseFloat(css.paddingTop)) * iframeScale.y;
|
|
3808
|
+
x *= iframeScale.x;
|
|
3809
|
+
y *= iframeScale.y;
|
|
3810
|
+
width *= iframeScale.x;
|
|
3811
|
+
height *= iframeScale.y;
|
|
3812
|
+
x += left;
|
|
3813
|
+
y += top;
|
|
3814
|
+
currentWin = getWindow(currentIFrame);
|
|
3815
|
+
currentIFrame = getFrameElement(currentWin);
|
|
3816
|
+
}
|
|
3817
|
+
}
|
|
3818
|
+
return rectToClientRect({
|
|
3819
|
+
width,
|
|
3820
|
+
height,
|
|
3821
|
+
x,
|
|
3822
|
+
y
|
|
3823
|
+
});
|
|
3824
|
+
}
|
|
3825
|
+
function getWindowScrollBarX(element, rect) {
|
|
3826
|
+
const leftScroll = getNodeScroll(element).scrollLeft;
|
|
3827
|
+
if (!rect) {
|
|
3828
|
+
return getBoundingClientRect(getDocumentElement(element)).left + leftScroll;
|
|
3829
|
+
}
|
|
3830
|
+
return rect.left + leftScroll;
|
|
3831
|
+
}
|
|
3832
|
+
function getHTMLOffset(documentElement, scroll) {
|
|
3833
|
+
const htmlRect = documentElement.getBoundingClientRect();
|
|
3834
|
+
const x = htmlRect.left + scroll.scrollLeft - getWindowScrollBarX(documentElement, htmlRect);
|
|
3835
|
+
const y = htmlRect.top + scroll.scrollTop;
|
|
3836
|
+
return {
|
|
3837
|
+
x,
|
|
3838
|
+
y
|
|
3839
|
+
};
|
|
3840
|
+
}
|
|
3841
|
+
function convertOffsetParentRelativeRectToViewportRelativeRect(_ref) {
|
|
3842
|
+
let {
|
|
3843
|
+
elements,
|
|
3844
|
+
rect,
|
|
3845
|
+
offsetParent,
|
|
3846
|
+
strategy
|
|
3847
|
+
} = _ref;
|
|
3848
|
+
const isFixed = strategy === "fixed";
|
|
3849
|
+
const documentElement = getDocumentElement(offsetParent);
|
|
3850
|
+
const topLayer = elements ? isTopLayer(elements.floating) : false;
|
|
3851
|
+
if (offsetParent === documentElement || topLayer && isFixed) {
|
|
3852
|
+
return rect;
|
|
3853
|
+
}
|
|
3854
|
+
let scroll = {
|
|
3855
|
+
scrollLeft: 0,
|
|
3856
|
+
scrollTop: 0
|
|
3857
|
+
};
|
|
3858
|
+
let scale = createCoords(1);
|
|
3859
|
+
const offsets = createCoords(0);
|
|
3860
|
+
const isOffsetParentAnElement = isHTMLElement(offsetParent);
|
|
3861
|
+
if (isOffsetParentAnElement || !isOffsetParentAnElement && !isFixed) {
|
|
3862
|
+
if (getNodeName(offsetParent) !== "body" || isOverflowElement(documentElement)) {
|
|
3863
|
+
scroll = getNodeScroll(offsetParent);
|
|
3864
|
+
}
|
|
3865
|
+
if (isHTMLElement(offsetParent)) {
|
|
3866
|
+
const offsetRect = getBoundingClientRect(offsetParent);
|
|
3867
|
+
scale = getScale(offsetParent);
|
|
3868
|
+
offsets.x = offsetRect.x + offsetParent.clientLeft;
|
|
3869
|
+
offsets.y = offsetRect.y + offsetParent.clientTop;
|
|
3870
|
+
}
|
|
3871
|
+
}
|
|
3872
|
+
const htmlOffset = documentElement && !isOffsetParentAnElement && !isFixed ? getHTMLOffset(documentElement, scroll) : createCoords(0);
|
|
3873
|
+
return {
|
|
3874
|
+
width: rect.width * scale.x,
|
|
3875
|
+
height: rect.height * scale.y,
|
|
3876
|
+
x: rect.x * scale.x - scroll.scrollLeft * scale.x + offsets.x + htmlOffset.x,
|
|
3877
|
+
y: rect.y * scale.y - scroll.scrollTop * scale.y + offsets.y + htmlOffset.y
|
|
3878
|
+
};
|
|
3879
|
+
}
|
|
3880
|
+
function getClientRects(element) {
|
|
3881
|
+
return Array.from(element.getClientRects());
|
|
3882
|
+
}
|
|
3883
|
+
function getDocumentRect(element) {
|
|
3884
|
+
const html = getDocumentElement(element);
|
|
3885
|
+
const scroll = getNodeScroll(element);
|
|
3886
|
+
const body = element.ownerDocument.body;
|
|
3887
|
+
const width = max(html.scrollWidth, html.clientWidth, body.scrollWidth, body.clientWidth);
|
|
3888
|
+
const height = max(html.scrollHeight, html.clientHeight, body.scrollHeight, body.clientHeight);
|
|
3889
|
+
let x = -scroll.scrollLeft + getWindowScrollBarX(element);
|
|
3890
|
+
const y = -scroll.scrollTop;
|
|
3891
|
+
if (getComputedStyle2(body).direction === "rtl") {
|
|
3892
|
+
x += max(html.clientWidth, body.clientWidth) - width;
|
|
3893
|
+
}
|
|
3894
|
+
return {
|
|
3895
|
+
width,
|
|
3896
|
+
height,
|
|
3897
|
+
x,
|
|
3898
|
+
y
|
|
3899
|
+
};
|
|
3900
|
+
}
|
|
3901
|
+
var SCROLLBAR_MAX = 25;
|
|
3902
|
+
function getViewportRect(element, strategy) {
|
|
3903
|
+
const win = getWindow(element);
|
|
3904
|
+
const html = getDocumentElement(element);
|
|
3905
|
+
const visualViewport = win.visualViewport;
|
|
3906
|
+
let width = html.clientWidth;
|
|
3907
|
+
let height = html.clientHeight;
|
|
3908
|
+
let x = 0;
|
|
3909
|
+
let y = 0;
|
|
3910
|
+
if (visualViewport) {
|
|
3911
|
+
width = visualViewport.width;
|
|
3912
|
+
height = visualViewport.height;
|
|
3913
|
+
const visualViewportBased = isWebKit();
|
|
3914
|
+
if (!visualViewportBased || visualViewportBased && strategy === "fixed") {
|
|
3915
|
+
x = visualViewport.offsetLeft;
|
|
3916
|
+
y = visualViewport.offsetTop;
|
|
3917
|
+
}
|
|
3918
|
+
}
|
|
3919
|
+
const windowScrollbarX = getWindowScrollBarX(html);
|
|
3920
|
+
if (windowScrollbarX <= 0) {
|
|
3921
|
+
const doc = html.ownerDocument;
|
|
3922
|
+
const body = doc.body;
|
|
3923
|
+
const bodyStyles = getComputedStyle(body);
|
|
3924
|
+
const bodyMarginInline = doc.compatMode === "CSS1Compat" ? parseFloat(bodyStyles.marginLeft) + parseFloat(bodyStyles.marginRight) || 0 : 0;
|
|
3925
|
+
const clippingStableScrollbarWidth = Math.abs(html.clientWidth - body.clientWidth - bodyMarginInline);
|
|
3926
|
+
if (clippingStableScrollbarWidth <= SCROLLBAR_MAX) {
|
|
3927
|
+
width -= clippingStableScrollbarWidth;
|
|
3928
|
+
}
|
|
3929
|
+
} else if (windowScrollbarX <= SCROLLBAR_MAX) {
|
|
3930
|
+
width += windowScrollbarX;
|
|
3931
|
+
}
|
|
3932
|
+
return {
|
|
3933
|
+
width,
|
|
3934
|
+
height,
|
|
3935
|
+
x,
|
|
3936
|
+
y
|
|
3937
|
+
};
|
|
3938
|
+
}
|
|
3939
|
+
var absoluteOrFixed = /* @__PURE__ */ new Set(["absolute", "fixed"]);
|
|
3940
|
+
function getInnerBoundingClientRect(element, strategy) {
|
|
3941
|
+
const clientRect = getBoundingClientRect(element, true, strategy === "fixed");
|
|
3942
|
+
const top = clientRect.top + element.clientTop;
|
|
3943
|
+
const left = clientRect.left + element.clientLeft;
|
|
3944
|
+
const scale = isHTMLElement(element) ? getScale(element) : createCoords(1);
|
|
3945
|
+
const width = element.clientWidth * scale.x;
|
|
3946
|
+
const height = element.clientHeight * scale.y;
|
|
3947
|
+
const x = left * scale.x;
|
|
3948
|
+
const y = top * scale.y;
|
|
3949
|
+
return {
|
|
3950
|
+
width,
|
|
3951
|
+
height,
|
|
3952
|
+
x,
|
|
3953
|
+
y
|
|
3954
|
+
};
|
|
3955
|
+
}
|
|
3956
|
+
function getClientRectFromClippingAncestor(element, clippingAncestor, strategy) {
|
|
3957
|
+
let rect;
|
|
3958
|
+
if (clippingAncestor === "viewport") {
|
|
3959
|
+
rect = getViewportRect(element, strategy);
|
|
3960
|
+
} else if (clippingAncestor === "document") {
|
|
3961
|
+
rect = getDocumentRect(getDocumentElement(element));
|
|
3962
|
+
} else if (isElement(clippingAncestor)) {
|
|
3963
|
+
rect = getInnerBoundingClientRect(clippingAncestor, strategy);
|
|
3964
|
+
} else {
|
|
3965
|
+
const visualOffsets = getVisualOffsets(element);
|
|
3966
|
+
rect = {
|
|
3967
|
+
x: clippingAncestor.x - visualOffsets.x,
|
|
3968
|
+
y: clippingAncestor.y - visualOffsets.y,
|
|
3969
|
+
width: clippingAncestor.width,
|
|
3970
|
+
height: clippingAncestor.height
|
|
3971
|
+
};
|
|
3972
|
+
}
|
|
3973
|
+
return rectToClientRect(rect);
|
|
3974
|
+
}
|
|
3975
|
+
function hasFixedPositionAncestor(element, stopNode) {
|
|
3976
|
+
const parentNode = getParentNode(element);
|
|
3977
|
+
if (parentNode === stopNode || !isElement(parentNode) || isLastTraversableNode(parentNode)) {
|
|
3978
|
+
return false;
|
|
3979
|
+
}
|
|
3980
|
+
return getComputedStyle2(parentNode).position === "fixed" || hasFixedPositionAncestor(parentNode, stopNode);
|
|
3981
|
+
}
|
|
3982
|
+
function getClippingElementAncestors(element, cache) {
|
|
3983
|
+
const cachedResult = cache.get(element);
|
|
3984
|
+
if (cachedResult) {
|
|
3985
|
+
return cachedResult;
|
|
3986
|
+
}
|
|
3987
|
+
let result = getOverflowAncestors(element, [], false).filter((el) => isElement(el) && getNodeName(el) !== "body");
|
|
3988
|
+
let currentContainingBlockComputedStyle = null;
|
|
3989
|
+
const elementIsFixed = getComputedStyle2(element).position === "fixed";
|
|
3990
|
+
let currentNode = elementIsFixed ? getParentNode(element) : element;
|
|
3991
|
+
while (isElement(currentNode) && !isLastTraversableNode(currentNode)) {
|
|
3992
|
+
const computedStyle = getComputedStyle2(currentNode);
|
|
3993
|
+
const currentNodeIsContaining = isContainingBlock(currentNode);
|
|
3994
|
+
if (!currentNodeIsContaining && computedStyle.position === "fixed") {
|
|
3995
|
+
currentContainingBlockComputedStyle = null;
|
|
3996
|
+
}
|
|
3997
|
+
const shouldDropCurrentNode = elementIsFixed ? !currentNodeIsContaining && !currentContainingBlockComputedStyle : !currentNodeIsContaining && computedStyle.position === "static" && !!currentContainingBlockComputedStyle && absoluteOrFixed.has(currentContainingBlockComputedStyle.position) || isOverflowElement(currentNode) && !currentNodeIsContaining && hasFixedPositionAncestor(element, currentNode);
|
|
3998
|
+
if (shouldDropCurrentNode) {
|
|
3999
|
+
result = result.filter((ancestor) => ancestor !== currentNode);
|
|
4000
|
+
} else {
|
|
4001
|
+
currentContainingBlockComputedStyle = computedStyle;
|
|
4002
|
+
}
|
|
4003
|
+
currentNode = getParentNode(currentNode);
|
|
4004
|
+
}
|
|
4005
|
+
cache.set(element, result);
|
|
4006
|
+
return result;
|
|
4007
|
+
}
|
|
4008
|
+
function getClippingRect(_ref) {
|
|
4009
|
+
let {
|
|
4010
|
+
element,
|
|
4011
|
+
boundary,
|
|
4012
|
+
rootBoundary,
|
|
4013
|
+
strategy
|
|
4014
|
+
} = _ref;
|
|
4015
|
+
const elementClippingAncestors = boundary === "clippingAncestors" ? isTopLayer(element) ? [] : getClippingElementAncestors(element, this._c) : [].concat(boundary);
|
|
4016
|
+
const clippingAncestors = [...elementClippingAncestors, rootBoundary];
|
|
4017
|
+
const firstClippingAncestor = clippingAncestors[0];
|
|
4018
|
+
const clippingRect = clippingAncestors.reduce((accRect, clippingAncestor) => {
|
|
4019
|
+
const rect = getClientRectFromClippingAncestor(element, clippingAncestor, strategy);
|
|
4020
|
+
accRect.top = max(rect.top, accRect.top);
|
|
4021
|
+
accRect.right = min(rect.right, accRect.right);
|
|
4022
|
+
accRect.bottom = min(rect.bottom, accRect.bottom);
|
|
4023
|
+
accRect.left = max(rect.left, accRect.left);
|
|
4024
|
+
return accRect;
|
|
4025
|
+
}, getClientRectFromClippingAncestor(element, firstClippingAncestor, strategy));
|
|
4026
|
+
return {
|
|
4027
|
+
width: clippingRect.right - clippingRect.left,
|
|
4028
|
+
height: clippingRect.bottom - clippingRect.top,
|
|
4029
|
+
x: clippingRect.left,
|
|
4030
|
+
y: clippingRect.top
|
|
4031
|
+
};
|
|
4032
|
+
}
|
|
4033
|
+
function getDimensions(element) {
|
|
4034
|
+
const {
|
|
4035
|
+
width,
|
|
4036
|
+
height
|
|
4037
|
+
} = getCssDimensions(element);
|
|
4038
|
+
return {
|
|
4039
|
+
width,
|
|
4040
|
+
height
|
|
4041
|
+
};
|
|
4042
|
+
}
|
|
4043
|
+
function getRectRelativeToOffsetParent(element, offsetParent, strategy) {
|
|
4044
|
+
const isOffsetParentAnElement = isHTMLElement(offsetParent);
|
|
4045
|
+
const documentElement = getDocumentElement(offsetParent);
|
|
4046
|
+
const isFixed = strategy === "fixed";
|
|
4047
|
+
const rect = getBoundingClientRect(element, true, isFixed, offsetParent);
|
|
4048
|
+
let scroll = {
|
|
4049
|
+
scrollLeft: 0,
|
|
4050
|
+
scrollTop: 0
|
|
4051
|
+
};
|
|
4052
|
+
const offsets = createCoords(0);
|
|
4053
|
+
function setLeftRTLScrollbarOffset() {
|
|
4054
|
+
offsets.x = getWindowScrollBarX(documentElement);
|
|
4055
|
+
}
|
|
4056
|
+
if (isOffsetParentAnElement || !isOffsetParentAnElement && !isFixed) {
|
|
4057
|
+
if (getNodeName(offsetParent) !== "body" || isOverflowElement(documentElement)) {
|
|
4058
|
+
scroll = getNodeScroll(offsetParent);
|
|
4059
|
+
}
|
|
4060
|
+
if (isOffsetParentAnElement) {
|
|
4061
|
+
const offsetRect = getBoundingClientRect(offsetParent, true, isFixed, offsetParent);
|
|
4062
|
+
offsets.x = offsetRect.x + offsetParent.clientLeft;
|
|
4063
|
+
offsets.y = offsetRect.y + offsetParent.clientTop;
|
|
4064
|
+
} else if (documentElement) {
|
|
4065
|
+
setLeftRTLScrollbarOffset();
|
|
4066
|
+
}
|
|
4067
|
+
}
|
|
4068
|
+
if (isFixed && !isOffsetParentAnElement && documentElement) {
|
|
4069
|
+
setLeftRTLScrollbarOffset();
|
|
4070
|
+
}
|
|
4071
|
+
const htmlOffset = documentElement && !isOffsetParentAnElement && !isFixed ? getHTMLOffset(documentElement, scroll) : createCoords(0);
|
|
4072
|
+
const x = rect.left + scroll.scrollLeft - offsets.x - htmlOffset.x;
|
|
4073
|
+
const y = rect.top + scroll.scrollTop - offsets.y - htmlOffset.y;
|
|
4074
|
+
return {
|
|
4075
|
+
x,
|
|
4076
|
+
y,
|
|
4077
|
+
width: rect.width,
|
|
4078
|
+
height: rect.height
|
|
4079
|
+
};
|
|
4080
|
+
}
|
|
4081
|
+
function isStaticPositioned(element) {
|
|
4082
|
+
return getComputedStyle2(element).position === "static";
|
|
4083
|
+
}
|
|
4084
|
+
function getTrueOffsetParent(element, polyfill) {
|
|
4085
|
+
if (!isHTMLElement(element) || getComputedStyle2(element).position === "fixed") {
|
|
4086
|
+
return null;
|
|
4087
|
+
}
|
|
4088
|
+
if (polyfill) {
|
|
4089
|
+
return polyfill(element);
|
|
4090
|
+
}
|
|
4091
|
+
let rawOffsetParent = element.offsetParent;
|
|
4092
|
+
if (getDocumentElement(element) === rawOffsetParent) {
|
|
4093
|
+
rawOffsetParent = rawOffsetParent.ownerDocument.body;
|
|
4094
|
+
}
|
|
4095
|
+
return rawOffsetParent;
|
|
4096
|
+
}
|
|
4097
|
+
function getOffsetParent(element, polyfill) {
|
|
4098
|
+
const win = getWindow(element);
|
|
4099
|
+
if (isTopLayer(element)) {
|
|
4100
|
+
return win;
|
|
4101
|
+
}
|
|
4102
|
+
if (!isHTMLElement(element)) {
|
|
4103
|
+
let svgOffsetParent = getParentNode(element);
|
|
4104
|
+
while (svgOffsetParent && !isLastTraversableNode(svgOffsetParent)) {
|
|
4105
|
+
if (isElement(svgOffsetParent) && !isStaticPositioned(svgOffsetParent)) {
|
|
4106
|
+
return svgOffsetParent;
|
|
4107
|
+
}
|
|
4108
|
+
svgOffsetParent = getParentNode(svgOffsetParent);
|
|
4109
|
+
}
|
|
4110
|
+
return win;
|
|
4111
|
+
}
|
|
4112
|
+
let offsetParent = getTrueOffsetParent(element, polyfill);
|
|
4113
|
+
while (offsetParent && isTableElement(offsetParent) && isStaticPositioned(offsetParent)) {
|
|
4114
|
+
offsetParent = getTrueOffsetParent(offsetParent, polyfill);
|
|
4115
|
+
}
|
|
4116
|
+
if (offsetParent && isLastTraversableNode(offsetParent) && isStaticPositioned(offsetParent) && !isContainingBlock(offsetParent)) {
|
|
4117
|
+
return win;
|
|
4118
|
+
}
|
|
4119
|
+
return offsetParent || getContainingBlock(element) || win;
|
|
4120
|
+
}
|
|
4121
|
+
var getElementRects = async function(data) {
|
|
4122
|
+
const getOffsetParentFn = this.getOffsetParent || getOffsetParent;
|
|
4123
|
+
const getDimensionsFn = this.getDimensions;
|
|
4124
|
+
const floatingDimensions = await getDimensionsFn(data.floating);
|
|
4125
|
+
return {
|
|
4126
|
+
reference: getRectRelativeToOffsetParent(data.reference, await getOffsetParentFn(data.floating), data.strategy),
|
|
4127
|
+
floating: {
|
|
4128
|
+
x: 0,
|
|
4129
|
+
y: 0,
|
|
4130
|
+
width: floatingDimensions.width,
|
|
4131
|
+
height: floatingDimensions.height
|
|
4132
|
+
}
|
|
4133
|
+
};
|
|
4134
|
+
};
|
|
4135
|
+
function isRTL(element) {
|
|
4136
|
+
return getComputedStyle2(element).direction === "rtl";
|
|
4137
|
+
}
|
|
4138
|
+
var platform = {
|
|
4139
|
+
convertOffsetParentRelativeRectToViewportRelativeRect,
|
|
4140
|
+
getDocumentElement,
|
|
4141
|
+
getClippingRect,
|
|
4142
|
+
getOffsetParent,
|
|
4143
|
+
getElementRects,
|
|
4144
|
+
getClientRects,
|
|
4145
|
+
getDimensions,
|
|
4146
|
+
getScale,
|
|
4147
|
+
isElement,
|
|
4148
|
+
isRTL
|
|
4149
|
+
};
|
|
4150
|
+
var offset2 = offset;
|
|
4151
|
+
var shift2 = shift;
|
|
4152
|
+
var flip2 = flip;
|
|
4153
|
+
var computePosition2 = (reference, floating, options) => {
|
|
4154
|
+
const cache = /* @__PURE__ */ new Map();
|
|
4155
|
+
const mergedOptions = {
|
|
4156
|
+
platform,
|
|
4157
|
+
...options
|
|
4158
|
+
};
|
|
4159
|
+
const platformWithCache = {
|
|
4160
|
+
...mergedOptions.platform,
|
|
4161
|
+
_c: cache
|
|
4162
|
+
};
|
|
4163
|
+
return computePosition(reference, floating, {
|
|
4164
|
+
...mergedOptions,
|
|
4165
|
+
platform: platformWithCache
|
|
4166
|
+
});
|
|
4167
|
+
};
|
|
4168
|
+
|
|
2937
4169
|
// src/link-tooltip.js
|
|
2938
4170
|
var LinkTooltip = class {
|
|
2939
4171
|
constructor(editor) {
|
|
@@ -2942,27 +4174,10 @@ var LinkTooltip = class {
|
|
|
2942
4174
|
this.currentLink = null;
|
|
2943
4175
|
this.hideTimeout = null;
|
|
2944
4176
|
this.visibilityChangeHandler = null;
|
|
2945
|
-
this.useFloatingUI = false;
|
|
2946
|
-
this.floatingUI = null;
|
|
2947
4177
|
this.isTooltipHovered = false;
|
|
2948
4178
|
this.init();
|
|
2949
4179
|
}
|
|
2950
|
-
|
|
2951
|
-
const supportsAnchorPositioning = CSS.supports("position-anchor: --x") && CSS.supports("position-area: center");
|
|
2952
|
-
if (!supportsAnchorPositioning) {
|
|
2953
|
-
try {
|
|
2954
|
-
const importFn = new Function("url", "return import(url)");
|
|
2955
|
-
const { computePosition, offset, shift, flip } = await importFn(
|
|
2956
|
-
"https://cdn.jsdelivr.net/npm/@floating-ui/dom@1.7.4/+esm"
|
|
2957
|
-
);
|
|
2958
|
-
this.floatingUI = { computePosition, offset, shift, flip };
|
|
2959
|
-
this.useFloatingUI = true;
|
|
2960
|
-
} catch (error) {
|
|
2961
|
-
console.warn("Failed to load Floating UI fallback:", error);
|
|
2962
|
-
this.floatingUI = null;
|
|
2963
|
-
this.useFloatingUI = false;
|
|
2964
|
-
}
|
|
2965
|
-
}
|
|
4180
|
+
init() {
|
|
2966
4181
|
this.createTooltip();
|
|
2967
4182
|
this.editor.textarea.addEventListener("selectionchange", () => this.checkCursorPosition());
|
|
2968
4183
|
this.editor.textarea.addEventListener("keyup", (e) => {
|
|
@@ -2972,10 +4187,8 @@ var LinkTooltip = class {
|
|
|
2972
4187
|
});
|
|
2973
4188
|
this.editor.textarea.addEventListener("input", () => this.hide());
|
|
2974
4189
|
this.editor.textarea.addEventListener("scroll", () => {
|
|
2975
|
-
if (this.
|
|
2976
|
-
this.
|
|
2977
|
-
} else {
|
|
2978
|
-
this.hide();
|
|
4190
|
+
if (this.currentLink) {
|
|
4191
|
+
this.positionTooltip(this.currentLink);
|
|
2979
4192
|
}
|
|
2980
4193
|
});
|
|
2981
4194
|
this.editor.textarea.addEventListener("blur", () => {
|
|
@@ -3052,22 +4265,17 @@ var LinkTooltip = class {
|
|
|
3052
4265
|
}
|
|
3053
4266
|
return null;
|
|
3054
4267
|
}
|
|
3055
|
-
show(linkInfo) {
|
|
4268
|
+
async show(linkInfo) {
|
|
3056
4269
|
this.currentLink = linkInfo;
|
|
3057
4270
|
this.cancelHide();
|
|
3058
4271
|
const urlSpan = this.tooltip.querySelector(".overtype-link-tooltip-url");
|
|
3059
4272
|
urlSpan.textContent = linkInfo.url;
|
|
3060
|
-
|
|
3061
|
-
|
|
3062
|
-
|
|
3063
|
-
this.showWithAnchorPositioning(linkInfo);
|
|
4273
|
+
await this.positionTooltip(linkInfo);
|
|
4274
|
+
if (this.currentLink === linkInfo) {
|
|
4275
|
+
this.tooltip.classList.add("visible");
|
|
3064
4276
|
}
|
|
3065
|
-
this.tooltip.classList.add("visible");
|
|
3066
|
-
}
|
|
3067
|
-
showWithAnchorPositioning(linkInfo) {
|
|
3068
|
-
this.tooltip.style.setProperty("--target-anchor", `--link-${linkInfo.index}`);
|
|
3069
4277
|
}
|
|
3070
|
-
async
|
|
4278
|
+
async positionTooltip(linkInfo) {
|
|
3071
4279
|
const anchorElement = this.findAnchorElement(linkInfo.index);
|
|
3072
4280
|
if (!anchorElement) {
|
|
3073
4281
|
return;
|
|
@@ -3077,26 +4285,26 @@ var LinkTooltip = class {
|
|
|
3077
4285
|
return;
|
|
3078
4286
|
}
|
|
3079
4287
|
try {
|
|
3080
|
-
const { x, y } = await
|
|
4288
|
+
const { x, y } = await computePosition2(
|
|
3081
4289
|
anchorElement,
|
|
3082
4290
|
this.tooltip,
|
|
3083
4291
|
{
|
|
4292
|
+
strategy: "fixed",
|
|
3084
4293
|
placement: "bottom",
|
|
3085
4294
|
middleware: [
|
|
3086
|
-
|
|
3087
|
-
|
|
3088
|
-
|
|
4295
|
+
offset2(8),
|
|
4296
|
+
shift2({ padding: 8 }),
|
|
4297
|
+
flip2()
|
|
3089
4298
|
]
|
|
3090
4299
|
}
|
|
3091
4300
|
);
|
|
3092
4301
|
Object.assign(this.tooltip.style, {
|
|
3093
4302
|
left: `${x}px`,
|
|
3094
4303
|
top: `${y}px`,
|
|
3095
|
-
position: "
|
|
4304
|
+
position: "fixed"
|
|
3096
4305
|
});
|
|
3097
4306
|
} catch (error) {
|
|
3098
4307
|
console.warn("Floating UI positioning failed:", error);
|
|
3099
|
-
return;
|
|
3100
4308
|
}
|
|
3101
4309
|
}
|
|
3102
4310
|
findAnchorElement(linkIndex) {
|
|
@@ -3129,8 +4337,6 @@ var LinkTooltip = class {
|
|
|
3129
4337
|
}
|
|
3130
4338
|
this.tooltip = null;
|
|
3131
4339
|
this.currentLink = null;
|
|
3132
|
-
this.floatingUI = null;
|
|
3133
|
-
this.useFloatingUI = false;
|
|
3134
4340
|
this.isTooltipHovered = false;
|
|
3135
4341
|
}
|
|
3136
4342
|
};
|
|
@@ -3193,6 +4399,11 @@ var taskListIcon = `<svg viewBox="0 0 18 18">
|
|
|
3193
4399
|
<rect stroke="currentColor" fill="none" stroke-width="1.5" x="2" y="13" width="3" height="3" rx="0.5"></rect>
|
|
3194
4400
|
<polyline stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" points="2.65 9.5 3.5 10.5 5 8.5"></polyline>
|
|
3195
4401
|
</svg>`;
|
|
4402
|
+
var uploadIcon = `<svg viewBox="0 0 18 18">
|
|
4403
|
+
<path stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M2.25 12.375v1.688A1.688 1.688 0 0 0 3.938 15.75h10.124a1.688 1.688 0 0 0 1.688-1.688V12.375"></path>
|
|
4404
|
+
<path stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5.063 6.188L9 2.25l3.938 3.938"></path>
|
|
4405
|
+
<path stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 2.25v10.125"></path>
|
|
4406
|
+
</svg>`;
|
|
3196
4407
|
var eyeIcon = `<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
3197
4408
|
<path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z" fill="none"></path>
|
|
3198
4409
|
<circle cx="12" cy="12" r="3" fill="none"></circle>
|
|
@@ -3316,6 +4527,33 @@ var toolbarButtons = {
|
|
|
3316
4527
|
editor.textarea.dispatchEvent(new Event("input", { bubbles: true }));
|
|
3317
4528
|
}
|
|
3318
4529
|
},
|
|
4530
|
+
upload: {
|
|
4531
|
+
name: "upload",
|
|
4532
|
+
actionId: "uploadFile",
|
|
4533
|
+
icon: uploadIcon,
|
|
4534
|
+
title: "Upload File",
|
|
4535
|
+
action: ({ editor }) => {
|
|
4536
|
+
var _a, _b;
|
|
4537
|
+
if (!((_a = editor.options.fileUpload) == null ? void 0 : _a.enabled))
|
|
4538
|
+
return;
|
|
4539
|
+
const input = document.createElement("input");
|
|
4540
|
+
input.type = "file";
|
|
4541
|
+
input.multiple = true;
|
|
4542
|
+
if (((_b = editor.options.fileUpload.mimeTypes) == null ? void 0 : _b.length) > 0) {
|
|
4543
|
+
input.accept = editor.options.fileUpload.mimeTypes.join(",");
|
|
4544
|
+
}
|
|
4545
|
+
input.onchange = () => {
|
|
4546
|
+
var _a2;
|
|
4547
|
+
if (!((_a2 = input.files) == null ? void 0 : _a2.length))
|
|
4548
|
+
return;
|
|
4549
|
+
const dt = new DataTransfer();
|
|
4550
|
+
for (const f of input.files)
|
|
4551
|
+
dt.items.add(f);
|
|
4552
|
+
editor._handleDataTransfer(dt);
|
|
4553
|
+
};
|
|
4554
|
+
input.click();
|
|
4555
|
+
}
|
|
4556
|
+
},
|
|
3319
4557
|
viewMode: {
|
|
3320
4558
|
name: "viewMode",
|
|
3321
4559
|
icon: eyeIcon,
|
|
@@ -3440,6 +4678,9 @@ var _OverType = class _OverType {
|
|
|
3440
4678
|
} else {
|
|
3441
4679
|
this._buildFromScratch();
|
|
3442
4680
|
}
|
|
4681
|
+
if (this.instanceTheme === "auto") {
|
|
4682
|
+
this.setTheme("auto");
|
|
4683
|
+
}
|
|
3443
4684
|
this.shortcuts = new ShortcutsManager(this);
|
|
3444
4685
|
this._rebuildActionsMap();
|
|
3445
4686
|
this.linkTooltip = new LinkTooltip(this);
|
|
@@ -3497,8 +4738,10 @@ var _OverType = class _OverType {
|
|
|
3497
4738
|
statsFormatter: null,
|
|
3498
4739
|
smartLists: true,
|
|
3499
4740
|
// Enable smart list continuation
|
|
3500
|
-
codeHighlighter: null
|
|
4741
|
+
codeHighlighter: null,
|
|
3501
4742
|
// Per-instance code highlighter
|
|
4743
|
+
spellcheck: false
|
|
4744
|
+
// Browser spellcheck (disabled by default)
|
|
3502
4745
|
};
|
|
3503
4746
|
const { theme, colors, ...cleanOptions } = options;
|
|
3504
4747
|
return {
|
|
@@ -3633,8 +4876,13 @@ var _OverType = class _OverType {
|
|
|
3633
4876
|
this.preview = document.createElement("div");
|
|
3634
4877
|
this.preview.className = "overtype-preview";
|
|
3635
4878
|
this.preview.setAttribute("aria-hidden", "true");
|
|
4879
|
+
this.placeholderEl = document.createElement("div");
|
|
4880
|
+
this.placeholderEl.className = "overtype-placeholder";
|
|
4881
|
+
this.placeholderEl.setAttribute("aria-hidden", "true");
|
|
4882
|
+
this.placeholderEl.textContent = this.options.placeholder;
|
|
3636
4883
|
this.wrapper.appendChild(this.textarea);
|
|
3637
4884
|
this.wrapper.appendChild(this.preview);
|
|
4885
|
+
this.wrapper.appendChild(this.placeholderEl);
|
|
3638
4886
|
this.container.appendChild(this.wrapper);
|
|
3639
4887
|
if (this.options.showStats) {
|
|
3640
4888
|
this.statsBar = document.createElement("div");
|
|
@@ -3657,7 +4905,7 @@ var _OverType = class _OverType {
|
|
|
3657
4905
|
this.textarea.setAttribute("autocomplete", "off");
|
|
3658
4906
|
this.textarea.setAttribute("autocorrect", "off");
|
|
3659
4907
|
this.textarea.setAttribute("autocapitalize", "off");
|
|
3660
|
-
this.textarea.setAttribute("spellcheck",
|
|
4908
|
+
this.textarea.setAttribute("spellcheck", String(this.options.spellcheck));
|
|
3661
4909
|
this.textarea.setAttribute("data-gramm", "false");
|
|
3662
4910
|
this.textarea.setAttribute("data-gramm_editor", "false");
|
|
3663
4911
|
this.textarea.setAttribute("data-enable-grammarly", "false");
|
|
@@ -3667,7 +4915,17 @@ var _OverType = class _OverType {
|
|
|
3667
4915
|
* @private
|
|
3668
4916
|
*/
|
|
3669
4917
|
_createToolbar() {
|
|
3670
|
-
|
|
4918
|
+
var _a;
|
|
4919
|
+
let toolbarButtons2 = this.options.toolbarButtons || defaultToolbarButtons;
|
|
4920
|
+
if (((_a = this.options.fileUpload) == null ? void 0 : _a.enabled) && !toolbarButtons2.some((b) => (b == null ? void 0 : b.name) === "upload")) {
|
|
4921
|
+
const viewModeIdx = toolbarButtons2.findIndex((b) => (b == null ? void 0 : b.name) === "viewMode");
|
|
4922
|
+
if (viewModeIdx !== -1) {
|
|
4923
|
+
toolbarButtons2 = [...toolbarButtons2];
|
|
4924
|
+
toolbarButtons2.splice(viewModeIdx, 0, toolbarButtons.separator, toolbarButtons.upload);
|
|
4925
|
+
} else {
|
|
4926
|
+
toolbarButtons2 = [...toolbarButtons2, toolbarButtons.separator, toolbarButtons.upload];
|
|
4927
|
+
}
|
|
4928
|
+
}
|
|
3671
4929
|
this.toolbar = new Toolbar(this, { toolbarButtons: toolbarButtons2 });
|
|
3672
4930
|
this.toolbar.create();
|
|
3673
4931
|
this._toolbarSelectionListener = () => {
|
|
@@ -3703,10 +4961,14 @@ var _OverType = class _OverType {
|
|
|
3703
4961
|
* @private
|
|
3704
4962
|
*/
|
|
3705
4963
|
_rebuildActionsMap() {
|
|
4964
|
+
var _a;
|
|
3706
4965
|
this.actionsById = buildActionsMap(defaultToolbarButtons);
|
|
3707
4966
|
if (this.options.toolbarButtons) {
|
|
3708
4967
|
Object.assign(this.actionsById, buildActionsMap(this.options.toolbarButtons));
|
|
3709
4968
|
}
|
|
4969
|
+
if ((_a = this.options.fileUpload) == null ? void 0 : _a.enabled) {
|
|
4970
|
+
Object.assign(this.actionsById, buildActionsMap([toolbarButtons.upload]));
|
|
4971
|
+
}
|
|
3710
4972
|
}
|
|
3711
4973
|
/**
|
|
3712
4974
|
* Apply options to the editor
|
|
@@ -3719,6 +4981,8 @@ var _OverType = class _OverType {
|
|
|
3719
4981
|
if (this.options.autoResize) {
|
|
3720
4982
|
if (!this.container.classList.contains("overtype-auto-resize")) {
|
|
3721
4983
|
this._setupAutoResize();
|
|
4984
|
+
} else {
|
|
4985
|
+
this._updateAutoHeight();
|
|
3722
4986
|
}
|
|
3723
4987
|
} else {
|
|
3724
4988
|
this.container.classList.remove("overtype-auto-resize");
|
|
@@ -3730,8 +4994,119 @@ var _OverType = class _OverType {
|
|
|
3730
4994
|
this.toolbar.destroy();
|
|
3731
4995
|
this.toolbar = null;
|
|
3732
4996
|
}
|
|
4997
|
+
if (this.placeholderEl) {
|
|
4998
|
+
this.placeholderEl.textContent = this.options.placeholder;
|
|
4999
|
+
}
|
|
5000
|
+
if (this.options.fileUpload && !this.fileUploadInitialized) {
|
|
5001
|
+
this._initFileUpload();
|
|
5002
|
+
} else if (!this.options.fileUpload && this.fileUploadInitialized) {
|
|
5003
|
+
this._destroyFileUpload();
|
|
5004
|
+
}
|
|
3733
5005
|
this.updatePreview();
|
|
3734
5006
|
}
|
|
5007
|
+
_initFileUpload() {
|
|
5008
|
+
const options = this.options.fileUpload;
|
|
5009
|
+
if (!options || !options.enabled)
|
|
5010
|
+
return;
|
|
5011
|
+
options.maxSize = options.maxSize || 10 * 1024 * 1024;
|
|
5012
|
+
options.mimeTypes = options.mimeTypes || [];
|
|
5013
|
+
options.batch = options.batch || false;
|
|
5014
|
+
if (!options.onInsertFile || typeof options.onInsertFile !== "function") {
|
|
5015
|
+
console.warn("OverType: fileUpload.onInsertFile callback is required for file uploads.");
|
|
5016
|
+
return;
|
|
5017
|
+
}
|
|
5018
|
+
this._fileUploadCounter = 0;
|
|
5019
|
+
this._boundHandleFilePaste = this._handleFilePaste.bind(this);
|
|
5020
|
+
this._boundHandleFileDrop = this._handleFileDrop.bind(this);
|
|
5021
|
+
this._boundHandleDragOver = this._handleDragOver.bind(this);
|
|
5022
|
+
this.textarea.addEventListener("paste", this._boundHandleFilePaste);
|
|
5023
|
+
this.textarea.addEventListener("drop", this._boundHandleFileDrop);
|
|
5024
|
+
this.textarea.addEventListener("dragover", this._boundHandleDragOver);
|
|
5025
|
+
this.fileUploadInitialized = true;
|
|
5026
|
+
}
|
|
5027
|
+
_handleFilePaste(e) {
|
|
5028
|
+
var _a, _b;
|
|
5029
|
+
if (!((_b = (_a = e == null ? void 0 : e.clipboardData) == null ? void 0 : _a.files) == null ? void 0 : _b.length))
|
|
5030
|
+
return;
|
|
5031
|
+
e.preventDefault();
|
|
5032
|
+
this._handleDataTransfer(e.clipboardData);
|
|
5033
|
+
}
|
|
5034
|
+
_handleFileDrop(e) {
|
|
5035
|
+
var _a, _b;
|
|
5036
|
+
if (!((_b = (_a = e == null ? void 0 : e.dataTransfer) == null ? void 0 : _a.files) == null ? void 0 : _b.length))
|
|
5037
|
+
return;
|
|
5038
|
+
e.preventDefault();
|
|
5039
|
+
this._handleDataTransfer(e.dataTransfer);
|
|
5040
|
+
}
|
|
5041
|
+
_handleDataTransfer(dataTransfer) {
|
|
5042
|
+
const files = [];
|
|
5043
|
+
for (const file of dataTransfer.files) {
|
|
5044
|
+
if (file.size > this.options.fileUpload.maxSize)
|
|
5045
|
+
continue;
|
|
5046
|
+
if (this.options.fileUpload.mimeTypes.length > 0 && !this.options.fileUpload.mimeTypes.includes(file.type))
|
|
5047
|
+
continue;
|
|
5048
|
+
const id = ++this._fileUploadCounter;
|
|
5049
|
+
const prefix = file.type.startsWith("image/") ? "!" : "";
|
|
5050
|
+
const placeholder = `${prefix}[Uploading ${file.name} (#${id})...]()`;
|
|
5051
|
+
this.insertAtCursor(`${placeholder}
|
|
5052
|
+
`);
|
|
5053
|
+
if (this.options.fileUpload.batch) {
|
|
5054
|
+
files.push({ file, placeholder });
|
|
5055
|
+
continue;
|
|
5056
|
+
}
|
|
5057
|
+
this.options.fileUpload.onInsertFile(file).then((text) => {
|
|
5058
|
+
this.textarea.value = this.textarea.value.replace(placeholder, text);
|
|
5059
|
+
this.textarea.dispatchEvent(new Event("input", { bubbles: true }));
|
|
5060
|
+
}, (error) => {
|
|
5061
|
+
console.error("OverType: File upload failed", error);
|
|
5062
|
+
this.textarea.value = this.textarea.value.replace(placeholder, "[Upload failed]()");
|
|
5063
|
+
this.textarea.dispatchEvent(new Event("input", { bubbles: true }));
|
|
5064
|
+
});
|
|
5065
|
+
}
|
|
5066
|
+
if (this.options.fileUpload.batch && files.length > 0) {
|
|
5067
|
+
this.options.fileUpload.onInsertFile(files.map((f) => f.file)).then((result) => {
|
|
5068
|
+
const texts = Array.isArray(result) ? result : [result];
|
|
5069
|
+
texts.forEach((text, index) => {
|
|
5070
|
+
this.textarea.value = this.textarea.value.replace(files[index].placeholder, text);
|
|
5071
|
+
});
|
|
5072
|
+
this.textarea.dispatchEvent(new Event("input", { bubbles: true }));
|
|
5073
|
+
}, (error) => {
|
|
5074
|
+
console.error("OverType: File upload failed", error);
|
|
5075
|
+
files.forEach(({ placeholder }) => {
|
|
5076
|
+
this.textarea.value = this.textarea.value.replace(placeholder, "[Upload failed]()");
|
|
5077
|
+
});
|
|
5078
|
+
this.textarea.dispatchEvent(new Event("input", { bubbles: true }));
|
|
5079
|
+
});
|
|
5080
|
+
}
|
|
5081
|
+
}
|
|
5082
|
+
_handleDragOver(e) {
|
|
5083
|
+
e.preventDefault();
|
|
5084
|
+
}
|
|
5085
|
+
_destroyFileUpload() {
|
|
5086
|
+
this.textarea.removeEventListener("paste", this._boundHandleFilePaste);
|
|
5087
|
+
this.textarea.removeEventListener("drop", this._boundHandleFileDrop);
|
|
5088
|
+
this.textarea.removeEventListener("dragover", this._boundHandleDragOver);
|
|
5089
|
+
this._boundHandleFilePaste = null;
|
|
5090
|
+
this._boundHandleFileDrop = null;
|
|
5091
|
+
this._boundHandleDragOver = null;
|
|
5092
|
+
this.fileUploadInitialized = false;
|
|
5093
|
+
}
|
|
5094
|
+
insertAtCursor(text) {
|
|
5095
|
+
const start = this.textarea.selectionStart;
|
|
5096
|
+
const end = this.textarea.selectionEnd;
|
|
5097
|
+
let inserted = false;
|
|
5098
|
+
try {
|
|
5099
|
+
inserted = document.execCommand("insertText", false, text);
|
|
5100
|
+
} catch (_) {
|
|
5101
|
+
}
|
|
5102
|
+
if (!inserted) {
|
|
5103
|
+
const before = this.textarea.value.slice(0, start);
|
|
5104
|
+
const after = this.textarea.value.slice(end);
|
|
5105
|
+
this.textarea.value = before + text + after;
|
|
5106
|
+
this.textarea.setSelectionRange(start + text.length, start + text.length);
|
|
5107
|
+
}
|
|
5108
|
+
this.textarea.dispatchEvent(new Event("input", { bubbles: true }));
|
|
5109
|
+
}
|
|
3735
5110
|
/**
|
|
3736
5111
|
* Update preview with parsed markdown
|
|
3737
5112
|
*/
|
|
@@ -3741,7 +5116,10 @@ var _OverType = class _OverType {
|
|
|
3741
5116
|
const activeLine = this._getCurrentLine(text, cursorPos);
|
|
3742
5117
|
const isPreviewMode = this.container.dataset.mode === "preview";
|
|
3743
5118
|
const html = MarkdownParser.parse(text, activeLine, this.options.showActiveLineRaw, this.options.codeHighlighter, isPreviewMode);
|
|
3744
|
-
this.preview.innerHTML = html
|
|
5119
|
+
this.preview.innerHTML = html;
|
|
5120
|
+
if (this.placeholderEl) {
|
|
5121
|
+
this.placeholderEl.style.display = text ? "none" : "";
|
|
5122
|
+
}
|
|
3745
5123
|
this._applyCodeBlockBackgrounds();
|
|
3746
5124
|
if (this.options.showStats && this.statsBar) {
|
|
3747
5125
|
this._updateStats();
|
|
@@ -3924,7 +5302,7 @@ var _OverType = class _OverType {
|
|
|
3924
5302
|
const cursorPos = this.textarea.selectionStart;
|
|
3925
5303
|
const newValue = MarkdownParser.renumberLists(value);
|
|
3926
5304
|
if (newValue !== value) {
|
|
3927
|
-
let
|
|
5305
|
+
let offset3 = 0;
|
|
3928
5306
|
const oldLines = value.split("\n");
|
|
3929
5307
|
const newLines = newValue.split("\n");
|
|
3930
5308
|
let charCount = 0;
|
|
@@ -3932,13 +5310,13 @@ var _OverType = class _OverType {
|
|
|
3932
5310
|
if (oldLines[i] !== newLines[i]) {
|
|
3933
5311
|
const diff = newLines[i].length - oldLines[i].length;
|
|
3934
5312
|
if (charCount + oldLines[i].length < cursorPos) {
|
|
3935
|
-
|
|
5313
|
+
offset3 += diff;
|
|
3936
5314
|
}
|
|
3937
5315
|
}
|
|
3938
5316
|
charCount += oldLines[i].length + 1;
|
|
3939
5317
|
}
|
|
3940
5318
|
this.textarea.value = newValue;
|
|
3941
|
-
const newCursorPos = cursorPos +
|
|
5319
|
+
const newCursorPos = cursorPos + offset3;
|
|
3942
5320
|
this.textarea.setSelectionRange(newCursorPos, newCursorPos);
|
|
3943
5321
|
this.textarea.dispatchEvent(new Event("input", { bubbles: true }));
|
|
3944
5322
|
}
|
|
@@ -4070,27 +5448,61 @@ var _OverType = class _OverType {
|
|
|
4070
5448
|
this.toolbar = null;
|
|
4071
5449
|
this._createToolbar();
|
|
4072
5450
|
}
|
|
5451
|
+
if (this.fileUploadInitialized) {
|
|
5452
|
+
this._destroyFileUpload();
|
|
5453
|
+
}
|
|
5454
|
+
if (this.options.fileUpload) {
|
|
5455
|
+
this._initFileUpload();
|
|
5456
|
+
}
|
|
4073
5457
|
this._applyOptions();
|
|
4074
5458
|
this.updatePreview();
|
|
4075
5459
|
}
|
|
5460
|
+
showToolbar() {
|
|
5461
|
+
if (this.toolbar) {
|
|
5462
|
+
this.toolbar.show();
|
|
5463
|
+
} else {
|
|
5464
|
+
this._createToolbar();
|
|
5465
|
+
}
|
|
5466
|
+
}
|
|
5467
|
+
hideToolbar() {
|
|
5468
|
+
if (this.toolbar) {
|
|
5469
|
+
this.toolbar.hide();
|
|
5470
|
+
}
|
|
5471
|
+
}
|
|
4076
5472
|
/**
|
|
4077
5473
|
* Set theme for this instance
|
|
4078
5474
|
* @param {string|Object} theme - Theme name or custom theme object
|
|
4079
5475
|
* @returns {this} Returns this for chaining
|
|
4080
5476
|
*/
|
|
4081
5477
|
setTheme(theme) {
|
|
5478
|
+
_OverType._autoInstances.delete(this);
|
|
4082
5479
|
this.instanceTheme = theme;
|
|
4083
|
-
|
|
4084
|
-
|
|
4085
|
-
|
|
4086
|
-
this.
|
|
5480
|
+
if (theme === "auto") {
|
|
5481
|
+
_OverType._autoInstances.add(this);
|
|
5482
|
+
_OverType._startAutoListener();
|
|
5483
|
+
this._applyResolvedTheme(resolveAutoTheme("auto"));
|
|
5484
|
+
} else {
|
|
5485
|
+
const themeObj = typeof theme === "string" ? getTheme(theme) : theme;
|
|
5486
|
+
const themeName = typeof themeObj === "string" ? themeObj : themeObj.name;
|
|
5487
|
+
if (themeName) {
|
|
5488
|
+
this.container.setAttribute("data-theme", themeName);
|
|
5489
|
+
}
|
|
5490
|
+
if (themeObj && themeObj.colors) {
|
|
5491
|
+
const cssVars = themeToCSSVars(themeObj.colors);
|
|
5492
|
+
this.container.style.cssText += cssVars;
|
|
5493
|
+
}
|
|
5494
|
+
this.updatePreview();
|
|
4087
5495
|
}
|
|
5496
|
+
_OverType._stopAutoListener();
|
|
5497
|
+
return this;
|
|
5498
|
+
}
|
|
5499
|
+
_applyResolvedTheme(themeName) {
|
|
5500
|
+
const themeObj = getTheme(themeName);
|
|
5501
|
+
this.container.setAttribute("data-theme", themeName);
|
|
4088
5502
|
if (themeObj && themeObj.colors) {
|
|
4089
|
-
|
|
4090
|
-
this.container.style.cssText += cssVars;
|
|
5503
|
+
this.container.style.cssText = themeToCSSVars(themeObj.colors);
|
|
4091
5504
|
}
|
|
4092
5505
|
this.updatePreview();
|
|
4093
|
-
return this;
|
|
4094
5506
|
}
|
|
4095
5507
|
/**
|
|
4096
5508
|
* Set instance-specific code highlighter
|
|
@@ -4244,6 +5656,11 @@ var _OverType = class _OverType {
|
|
|
4244
5656
|
* Destroy the editor instance
|
|
4245
5657
|
*/
|
|
4246
5658
|
destroy() {
|
|
5659
|
+
_OverType._autoInstances.delete(this);
|
|
5660
|
+
_OverType._stopAutoListener();
|
|
5661
|
+
if (this.fileUploadInitialized) {
|
|
5662
|
+
this._destroyFileUpload();
|
|
5663
|
+
}
|
|
4247
5664
|
this.element.overTypeInstance = null;
|
|
4248
5665
|
_OverType.instances.delete(this.element);
|
|
4249
5666
|
if (this.shortcuts) {
|
|
@@ -4286,7 +5703,7 @@ var _OverType = class _OverType {
|
|
|
4286
5703
|
options[key] = _OverType._parseDataValue(attr.value);
|
|
4287
5704
|
}
|
|
4288
5705
|
}
|
|
4289
|
-
return new _OverType(el, options);
|
|
5706
|
+
return new _OverType(el, options)[0];
|
|
4290
5707
|
});
|
|
4291
5708
|
}
|
|
4292
5709
|
/**
|
|
@@ -4349,23 +5766,35 @@ var _OverType = class _OverType {
|
|
|
4349
5766
|
* @param {Object} customColors - Optional color overrides
|
|
4350
5767
|
*/
|
|
4351
5768
|
static setTheme(theme, customColors = null) {
|
|
5769
|
+
_OverType._globalAutoTheme = false;
|
|
5770
|
+
_OverType._globalAutoCustomColors = null;
|
|
5771
|
+
if (theme === "auto") {
|
|
5772
|
+
_OverType._globalAutoTheme = true;
|
|
5773
|
+
_OverType._globalAutoCustomColors = customColors;
|
|
5774
|
+
_OverType._startAutoListener();
|
|
5775
|
+
_OverType._applyGlobalTheme(resolveAutoTheme("auto"), customColors);
|
|
5776
|
+
return;
|
|
5777
|
+
}
|
|
5778
|
+
_OverType._stopAutoListener();
|
|
5779
|
+
_OverType._applyGlobalTheme(theme, customColors);
|
|
5780
|
+
}
|
|
5781
|
+
static _applyGlobalTheme(theme, customColors = null) {
|
|
4352
5782
|
let themeObj = typeof theme === "string" ? getTheme(theme) : theme;
|
|
4353
5783
|
if (customColors) {
|
|
4354
5784
|
themeObj = mergeTheme(themeObj, customColors);
|
|
4355
5785
|
}
|
|
4356
5786
|
_OverType.currentTheme = themeObj;
|
|
4357
5787
|
_OverType.injectStyles(true);
|
|
5788
|
+
const themeName = typeof themeObj === "string" ? themeObj : themeObj.name;
|
|
4358
5789
|
document.querySelectorAll(".overtype-container").forEach((container) => {
|
|
4359
|
-
|
|
4360
|
-
|
|
4361
|
-
container.setAttribute("data-theme", themeName2);
|
|
5790
|
+
if (themeName) {
|
|
5791
|
+
container.setAttribute("data-theme", themeName);
|
|
4362
5792
|
}
|
|
4363
5793
|
});
|
|
4364
5794
|
document.querySelectorAll(".overtype-wrapper").forEach((wrapper) => {
|
|
4365
5795
|
if (!wrapper.closest(".overtype-container")) {
|
|
4366
|
-
|
|
4367
|
-
|
|
4368
|
-
wrapper.setAttribute("data-theme", themeName2);
|
|
5796
|
+
if (themeName) {
|
|
5797
|
+
wrapper.setAttribute("data-theme", themeName);
|
|
4369
5798
|
}
|
|
4370
5799
|
}
|
|
4371
5800
|
const instance = wrapper._instance;
|
|
@@ -4373,7 +5802,6 @@ var _OverType = class _OverType {
|
|
|
4373
5802
|
instance.updatePreview();
|
|
4374
5803
|
}
|
|
4375
5804
|
});
|
|
4376
|
-
const themeName = typeof themeObj === "string" ? themeObj : themeObj.name;
|
|
4377
5805
|
document.querySelectorAll("overtype-editor").forEach((webComponent) => {
|
|
4378
5806
|
if (themeName && typeof webComponent.setAttribute === "function") {
|
|
4379
5807
|
webComponent.setAttribute("theme", themeName);
|
|
@@ -4383,6 +5811,30 @@ var _OverType = class _OverType {
|
|
|
4383
5811
|
}
|
|
4384
5812
|
});
|
|
4385
5813
|
}
|
|
5814
|
+
static _startAutoListener() {
|
|
5815
|
+
if (_OverType._autoMediaQuery)
|
|
5816
|
+
return;
|
|
5817
|
+
if (!window.matchMedia)
|
|
5818
|
+
return;
|
|
5819
|
+
_OverType._autoMediaQuery = window.matchMedia("(prefers-color-scheme: dark)");
|
|
5820
|
+
_OverType._autoMediaListener = (e) => {
|
|
5821
|
+
const resolved = e.matches ? "cave" : "solar";
|
|
5822
|
+
if (_OverType._globalAutoTheme) {
|
|
5823
|
+
_OverType._applyGlobalTheme(resolved, _OverType._globalAutoCustomColors);
|
|
5824
|
+
}
|
|
5825
|
+
_OverType._autoInstances.forEach((inst) => inst._applyResolvedTheme(resolved));
|
|
5826
|
+
};
|
|
5827
|
+
_OverType._autoMediaQuery.addEventListener("change", _OverType._autoMediaListener);
|
|
5828
|
+
}
|
|
5829
|
+
static _stopAutoListener() {
|
|
5830
|
+
if (_OverType._autoInstances.size > 0 || _OverType._globalAutoTheme)
|
|
5831
|
+
return;
|
|
5832
|
+
if (!_OverType._autoMediaQuery)
|
|
5833
|
+
return;
|
|
5834
|
+
_OverType._autoMediaQuery.removeEventListener("change", _OverType._autoMediaListener);
|
|
5835
|
+
_OverType._autoMediaQuery = null;
|
|
5836
|
+
_OverType._autoMediaListener = null;
|
|
5837
|
+
}
|
|
4386
5838
|
/**
|
|
4387
5839
|
* Set global code highlighter for all OverType instances
|
|
4388
5840
|
* @param {Function|null} highlighter - Function that takes (code, language) and returns highlighted HTML
|
|
@@ -4484,6 +5936,11 @@ __publicField(_OverType, "instances", /* @__PURE__ */ new WeakMap());
|
|
|
4484
5936
|
__publicField(_OverType, "stylesInjected", false);
|
|
4485
5937
|
__publicField(_OverType, "globalListenersInitialized", false);
|
|
4486
5938
|
__publicField(_OverType, "instanceCount", 0);
|
|
5939
|
+
__publicField(_OverType, "_autoMediaQuery", null);
|
|
5940
|
+
__publicField(_OverType, "_autoMediaListener", null);
|
|
5941
|
+
__publicField(_OverType, "_autoInstances", /* @__PURE__ */ new Set());
|
|
5942
|
+
__publicField(_OverType, "_globalAutoTheme", false);
|
|
5943
|
+
__publicField(_OverType, "_globalAutoCustomColors", null);
|
|
4487
5944
|
var OverType = _OverType;
|
|
4488
5945
|
OverType.MarkdownParser = MarkdownParser;
|
|
4489
5946
|
OverType.ShortcutsManager = ShortcutsManager;
|