@yahoo/uds 3.116.3 → 3.117.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/automated-config/dist/generated/autoVariants.cjs +11 -0
- package/dist/automated-config/dist/generated/autoVariants.d.cts +11 -0
- package/dist/automated-config/dist/generated/autoVariants.d.ts +11 -0
- package/dist/automated-config/dist/generated/autoVariants.js +11 -0
- package/dist/automated-config/dist/generated/generatedConfigs.cjs +1890 -0
- package/dist/automated-config/dist/generated/generatedConfigs.d.cts +208 -1
- package/dist/automated-config/dist/generated/generatedConfigs.d.ts +208 -1
- package/dist/automated-config/dist/generated/generatedConfigs.js +1890 -1
- package/dist/automated-config/dist/generated/universalTokensConfigAuto.cjs +83 -0
- package/dist/automated-config/dist/generated/universalTokensConfigAuto.d.cts +2 -1
- package/dist/automated-config/dist/generated/universalTokensConfigAuto.d.ts +2 -1
- package/dist/automated-config/dist/generated/universalTokensConfigAuto.js +83 -0
- package/dist/cli/commands/sync.cjs +6 -0
- package/dist/cli/commands/sync.js +6 -0
- package/dist/components/SvgFloatingOverlay.cjs +122 -0
- package/dist/components/SvgFloatingOverlay.d.cts +42 -0
- package/dist/components/SvgFloatingOverlay.d.ts +42 -0
- package/dist/components/SvgFloatingOverlay.js +120 -0
- package/dist/components/client/Menu/Menu.ItemCheckbox.d.cts +1 -1
- package/dist/components/client/Menu/Menu.ItemCheckbox.d.ts +1 -1
- package/dist/components/client/Popover/Popover.cjs +96 -0
- package/dist/components/client/Popover/Popover.d.cts +55 -0
- package/dist/components/client/Popover/Popover.d.ts +55 -0
- package/dist/components/client/Popover/Popover.js +94 -0
- package/dist/components/client/Popover/PopoverContent.cjs +175 -0
- package/dist/components/client/Popover/PopoverContent.d.cts +26 -0
- package/dist/components/client/Popover/PopoverContent.d.ts +26 -0
- package/dist/components/client/Popover/PopoverContent.js +173 -0
- package/dist/components/client/Popover/PopoverContext.cjs +11 -0
- package/dist/components/client/Popover/PopoverContext.d.cts +21 -0
- package/dist/components/client/Popover/PopoverContext.d.ts +21 -0
- package/dist/components/client/Popover/PopoverContext.js +9 -0
- package/dist/components/client/Popover/PopoverTrigger.cjs +26 -0
- package/dist/components/client/Popover/PopoverTrigger.d.cts +14 -0
- package/dist/components/client/Popover/PopoverTrigger.d.ts +14 -0
- package/dist/components/client/Popover/PopoverTrigger.js +24 -0
- package/dist/components/client/Popover/UDSPopoverConfigProvider.cjs +40 -0
- package/dist/components/client/Popover/UDSPopoverConfigProvider.d.cts +28 -0
- package/dist/components/client/Popover/UDSPopoverConfigProvider.d.ts +28 -0
- package/dist/components/client/Popover/UDSPopoverConfigProvider.js +37 -0
- package/dist/components/client/Popover/index.cjs +12 -0
- package/dist/components/client/Popover/index.d.cts +7 -0
- package/dist/components/client/Popover/index.d.ts +7 -0
- package/dist/components/client/Popover/index.js +8 -0
- package/dist/components/client/Toast/Toast.cjs +3 -3
- package/dist/components/client/Toast/Toast.d.cts +1 -1
- package/dist/components/client/Toast/Toast.d.ts +1 -1
- package/dist/components/client/Toast/Toast.js +3 -3
- package/dist/components/client/Toast/index.d.cts +1 -1
- package/dist/components/client/Toast/index.d.ts +1 -1
- package/dist/components/client/Tooltip/Tooltip.cjs +6 -6
- package/dist/components/client/Tooltip/Tooltip.d.cts +1 -1
- package/dist/components/client/Tooltip/Tooltip.d.ts +1 -1
- package/dist/components/client/Tooltip/Tooltip.js +6 -6
- package/dist/components/client/Tooltip/TooltipContent.cjs +33 -96
- package/dist/components/client/Tooltip/TooltipContent.js +34 -97
- package/dist/components/client/Tooltip/tooltipContext.cjs +0 -1
- package/dist/components/client/Tooltip/tooltipContext.d.cts +1 -2
- package/dist/components/client/Tooltip/tooltipContext.d.ts +1 -2
- package/dist/components/client/Tooltip/tooltipContext.js +0 -1
- package/dist/components/client/index.cjs +8 -0
- package/dist/components/client/index.d.cts +10 -5
- package/dist/components/client/index.d.ts +10 -5
- package/dist/components/client/index.js +5 -1
- package/dist/components/client/providers/UDSConfigProvider.cjs +6 -2
- package/dist/components/client/providers/UDSConfigProvider.d.cts +2 -1
- package/dist/components/client/providers/UDSConfigProvider.d.ts +2 -1
- package/dist/components/client/providers/UDSConfigProvider.js +6 -2
- package/dist/components/experimental/client/{Popover.cjs → ExperimentalPopover.cjs} +10 -1
- package/dist/components/experimental/client/ExperimentalPopover.d.cts +40 -0
- package/dist/components/experimental/client/ExperimentalPopover.d.ts +40 -0
- package/dist/components/experimental/client/{Popover.js → ExperimentalPopover.js} +10 -1
- package/dist/components/experimental/client/index.cjs +10 -10
- package/dist/components/experimental/client/index.d.cts +2 -2
- package/dist/components/experimental/client/index.d.ts +2 -2
- package/dist/components/experimental/client/index.js +1 -1
- package/dist/components/experimental/index.cjs +19 -19
- package/dist/components/experimental/index.d.cts +2 -2
- package/dist/components/experimental/index.d.ts +2 -2
- package/dist/components/experimental/index.js +1 -1
- package/dist/components/index.cjs +12 -0
- package/dist/components/index.d.cts +9 -5
- package/dist/components/index.d.ts +9 -5
- package/dist/components/index.js +9 -1
- package/dist/config/dist/index.cjs +84 -1
- package/dist/config/dist/index.js +84 -1
- package/dist/hooks/useSvgFloatingContent.cjs +236 -0
- package/dist/hooks/useSvgFloatingContent.d.cts +74 -0
- package/dist/hooks/useSvgFloatingContent.d.ts +74 -0
- package/dist/{components/client/Tooltip/useTooltipContent.js → hooks/useSvgFloatingContent.js} +94 -44
- package/dist/index.cjs +21 -10
- package/dist/index.d.cts +15 -10
- package/dist/index.d.ts +15 -10
- package/dist/index.js +16 -11
- package/dist/runtime/index.cjs +2 -0
- package/dist/runtime/index.d.cts +3 -2
- package/dist/runtime/index.d.ts +3 -2
- package/dist/runtime/index.js +2 -1
- package/dist/runtime/popoverConfig.cjs +36 -0
- package/dist/runtime/popoverConfig.d.cts +25 -0
- package/dist/runtime/popoverConfig.d.ts +25 -0
- package/dist/runtime/popoverConfig.js +35 -0
- package/dist/runtime/udsConfig.cjs +3 -1
- package/dist/runtime/udsConfig.d.cts +3 -1
- package/dist/runtime/udsConfig.d.ts +3 -1
- package/dist/runtime/udsConfig.js +3 -1
- package/dist/styles/styler.d.cts +114 -103
- package/dist/styles/styler.d.ts +114 -103
- package/dist/styles/variants.d.cts +33 -0
- package/dist/styles/variants.d.ts +33 -0
- package/dist/tailwind/dist/tailwind/plugins/components.cjs +1 -0
- package/dist/tailwind/dist/tailwind/plugins/components.js +2 -1
- package/dist/tokens/automation/configs/index.cjs +1 -0
- package/dist/tokens/automation/configs/index.d.cts +2 -2
- package/dist/tokens/automation/configs/index.d.ts +2 -2
- package/dist/tokens/automation/configs/index.js +2 -2
- package/dist/tokens/automation/index.cjs +1 -0
- package/dist/tokens/automation/index.d.cts +2 -2
- package/dist/tokens/automation/index.d.ts +2 -2
- package/dist/tokens/automation/index.js +2 -2
- package/dist/tokens/index.cjs +2 -1
- package/dist/tokens/index.d.cts +3 -3
- package/dist/tokens/index.d.ts +3 -3
- package/dist/tokens/index.js +3 -3
- package/dist/tokens/types.d.cts +2 -2
- package/dist/tokens/types.d.ts +2 -2
- package/dist/types/dist/index.d.cts +51 -1
- package/dist/types/dist/index.d.ts +51 -1
- package/dist/uds/generated/componentData.cjs +1296 -1134
- package/dist/uds/generated/componentData.js +1262 -1136
- package/dist/uds/generated/tailwindPurge.cjs +55 -27
- package/dist/uds/generated/tailwindPurge.js +55 -27
- package/dist/utils/parseShadow.cjs +120 -0
- package/dist/utils/parseShadow.d.cts +33 -0
- package/dist/utils/parseShadow.d.ts +33 -0
- package/dist/utils/parseShadow.js +118 -0
- package/dist/utils/svgFloatingContentUtils.cjs +121 -0
- package/dist/{components/client/Tooltip/util.d.cts → utils/svgFloatingContentUtils.d.cts} +25 -62
- package/dist/{components/client/Tooltip/util.d.ts → utils/svgFloatingContentUtils.d.ts} +25 -62
- package/dist/utils/svgFloatingContentUtils.js +117 -0
- package/generated/componentData.json +1628 -1469
- package/generated/tailwindPurge.ts +4 -4
- package/package.json +1 -1
- package/dist/components/client/Tooltip/useTooltipContent.cjs +0 -186
- package/dist/components/client/Tooltip/useTooltipContent.d.cts +0 -66
- package/dist/components/client/Tooltip/useTooltipContent.d.ts +0 -66
- package/dist/components/client/Tooltip/util.cjs +0 -248
- package/dist/components/client/Tooltip/util.js +0 -240
- package/dist/components/experimental/client/Popover.d.cts +0 -29
- package/dist/components/experimental/client/Popover.d.ts +0 -29
|
@@ -1,240 +0,0 @@
|
|
|
1
|
-
"use client";
|
|
2
|
-
/*! © 2026 Yahoo, Inc. UDS v0.0.0-development */
|
|
3
|
-
//#region src/components/client/Tooltip/util.ts
|
|
4
|
-
/**
|
|
5
|
-
* Splits a CSS value on whitespace, but keeps parenthesized groups
|
|
6
|
-
* (e.g. `rgb(0, 0, 0)`) together as single tokens.
|
|
7
|
-
*/
|
|
8
|
-
function tokenizeCSSValue(value) {
|
|
9
|
-
const tokens = [];
|
|
10
|
-
let current = "";
|
|
11
|
-
let depth = 0;
|
|
12
|
-
for (const char of value) {
|
|
13
|
-
if (char === "(") depth++;
|
|
14
|
-
if (char === ")") depth--;
|
|
15
|
-
if (char === " " && depth === 0) {
|
|
16
|
-
if (current) tokens.push(current);
|
|
17
|
-
current = "";
|
|
18
|
-
} else current += char;
|
|
19
|
-
}
|
|
20
|
-
if (current) tokens.push(current);
|
|
21
|
-
return tokens;
|
|
22
|
-
}
|
|
23
|
-
/**
|
|
24
|
-
* Returns `true` if the token is a CSS color value.
|
|
25
|
-
*
|
|
26
|
-
* In a box-shadow context (after filtering `inset`), every token is either a
|
|
27
|
-
* length or a color. Colors always start with `#` (hex), a letter (named
|
|
28
|
-
* colors like `red`, `transparent`, `currentcolor`), or are a CSS function
|
|
29
|
-
* containing `(` (e.g. `rgb(…)`, `hsl(…)`, `oklch(…)`).
|
|
30
|
-
*/
|
|
31
|
-
function isColorToken(token) {
|
|
32
|
-
const ch = token[0];
|
|
33
|
-
return ch !== "-" && ch !== "." && (ch < "0" || ch > "9");
|
|
34
|
-
}
|
|
35
|
-
/**
|
|
36
|
-
* Splits a CSS multi-shadow value (comma-separated) into individual
|
|
37
|
-
* shadow strings, correctly handling commas nested inside color functions
|
|
38
|
-
* like `rgb()`, `rgba()`, `hsl()`, etc.
|
|
39
|
-
*/
|
|
40
|
-
function splitShadows(value) {
|
|
41
|
-
const shadows = [];
|
|
42
|
-
let current = "";
|
|
43
|
-
let depth = 0;
|
|
44
|
-
for (let i = 0; i < value.length; i++) {
|
|
45
|
-
const char = value[i];
|
|
46
|
-
if (char === "(") {
|
|
47
|
-
depth++;
|
|
48
|
-
current += char;
|
|
49
|
-
} else if (char === ")") {
|
|
50
|
-
depth--;
|
|
51
|
-
current += char;
|
|
52
|
-
} else if (char === "," && depth === 0) {
|
|
53
|
-
if (current.trim()) shadows.push(current.trim());
|
|
54
|
-
current = "";
|
|
55
|
-
} else current += char;
|
|
56
|
-
}
|
|
57
|
-
if (current.trim()) shadows.push(current.trim());
|
|
58
|
-
return shadows;
|
|
59
|
-
}
|
|
60
|
-
/**
|
|
61
|
-
* Parses a single CSS shadow value string into its constituent parts.
|
|
62
|
-
*
|
|
63
|
-
* Handles all standard CSS box-shadow / drop-shadow permutations:
|
|
64
|
-
* - Color before or after length values (`red 0 4px 8px` or `0 4px 8px red`)
|
|
65
|
-
* - Optional blur and spread radii (defaults to 0)
|
|
66
|
-
* - `inset` keyword at any position (silently ignored)
|
|
67
|
-
* - All color formats: named, hex (3/4/6/8-digit), rgb/rgba, hsl/hsla, oklch,
|
|
68
|
-
* oklab, lab, lch, color(), color-mix(), light-dark(), etc.
|
|
69
|
-
* - `none` / empty values → zeroed-out result with `transparent` color
|
|
70
|
-
*/
|
|
71
|
-
function parseSingleShadow(shadow) {
|
|
72
|
-
const value = shadow.trim();
|
|
73
|
-
if (!value || value.toLowerCase() === "none") return {
|
|
74
|
-
x: 0,
|
|
75
|
-
y: 0,
|
|
76
|
-
blur: 0,
|
|
77
|
-
spread: 0,
|
|
78
|
-
color: "transparent"
|
|
79
|
-
};
|
|
80
|
-
const tokens = tokenizeCSSValue(value);
|
|
81
|
-
const lengths = [];
|
|
82
|
-
const colorParts = [];
|
|
83
|
-
for (const token of tokens) {
|
|
84
|
-
if (token.toLowerCase() === "inset") continue;
|
|
85
|
-
if (isColorToken(token)) colorParts.push(token);
|
|
86
|
-
else lengths.push(token);
|
|
87
|
-
}
|
|
88
|
-
return {
|
|
89
|
-
x: lengths.length > 0 ? parseFloat(lengths[0]) : 0,
|
|
90
|
-
y: lengths.length > 1 ? parseFloat(lengths[1]) : 0,
|
|
91
|
-
blur: lengths.length > 2 ? parseFloat(lengths[2]) : 0,
|
|
92
|
-
spread: lengths.length > 3 ? parseFloat(lengths[3]) : 0,
|
|
93
|
-
color: colorParts.length > 0 ? colorParts.join(" ") : "rgb(0 0 0 / 1)"
|
|
94
|
-
};
|
|
95
|
-
}
|
|
96
|
-
/**
|
|
97
|
-
* Parses a CSS shadow value — which may contain multiple comma-separated
|
|
98
|
-
* layers — into an array of {@link ParsedShadow} objects.
|
|
99
|
-
*
|
|
100
|
-
* @example
|
|
101
|
-
* ```ts
|
|
102
|
-
* parseShadow('0px 4px 8px 0px rgb(0 0 0 / 0.12)')
|
|
103
|
-
* // → [{ x: 0, y: 4, blur: 8, spread: 0, color: 'rgb(0 0 0 / 0.12)' }]
|
|
104
|
-
*
|
|
105
|
-
* parseShadow('0px 4px 8px rgb(0 0 0 / 0.12), 0px 1px 2px rgba(0, 0, 0, 0.08)')
|
|
106
|
-
* // → [
|
|
107
|
-
* // { x: 0, y: 4, blur: 8, spread: 0, color: 'rgb(0 0 0 / 0.12)' },
|
|
108
|
-
* // { x: 0, y: 1, blur: 2, spread: 0, color: 'rgba(0, 0, 0, 0.08)' },
|
|
109
|
-
* // ]
|
|
110
|
-
* ```
|
|
111
|
-
*/
|
|
112
|
-
function parseShadow(shadowValue) {
|
|
113
|
-
const trimmed = shadowValue.trim();
|
|
114
|
-
if (!trimmed || trimmed.toLowerCase() === "none") return [];
|
|
115
|
-
return splitShadows(trimmed).map(parseSingleShadow);
|
|
116
|
-
}
|
|
117
|
-
/** Base width of the arrow triangle (px). */
|
|
118
|
-
const ARROW_WIDTH = 12;
|
|
119
|
-
/** Height (protrusion) of the arrow triangle from the edge (px). */
|
|
120
|
-
const ARROW_HEIGHT = 8;
|
|
121
|
-
/**
|
|
122
|
-
* Fraction of the container border-radius applied to round the arrow tip
|
|
123
|
-
* (0 = sharp point, 1 = same radius as the container corners).
|
|
124
|
-
*/
|
|
125
|
-
const ARROW_TIP_RADIUS_FRACTION = .5;
|
|
126
|
-
/**
|
|
127
|
-
* Returns the side of the tooltip where the arrow should appear.
|
|
128
|
-
* The arrow points *toward* the trigger, so it lives on the opposite
|
|
129
|
-
* side of the placement direction.
|
|
130
|
-
*/
|
|
131
|
-
function getArrowSide(placement) {
|
|
132
|
-
switch (placement.split("-")[0]) {
|
|
133
|
-
case "bottom": return "top";
|
|
134
|
-
case "top": return "bottom";
|
|
135
|
-
case "left": return "right";
|
|
136
|
-
case "right": return "left";
|
|
137
|
-
default: return "top";
|
|
138
|
-
}
|
|
139
|
-
}
|
|
140
|
-
/**
|
|
141
|
-
* Generates an SVG `<path>` string for a rounded rectangle with an arrow
|
|
142
|
-
* pointing toward the trigger element.
|
|
143
|
-
*
|
|
144
|
-
* The path is traced clockwise, inserting the arrow triangle on the
|
|
145
|
-
* appropriate edge. The arrow extends *outside* the 0,0 → width,height
|
|
146
|
-
* rectangle so the host `<svg>` must use `overflow: visible`.
|
|
147
|
-
*/
|
|
148
|
-
function generateTooltipPath({ width, height, placement, borderRadius, arrowWidth = ARROW_WIDTH, arrowHeight = ARROW_HEIGHT, arrowCenter, offsetX: ox = 0, offsetY: oy = 0 }) {
|
|
149
|
-
const aw = arrowWidth / 2;
|
|
150
|
-
const ah = arrowHeight;
|
|
151
|
-
const arrowSide = getArrowSide(placement);
|
|
152
|
-
const arrowEdge = arrowSide === "top" || arrowSide === "bottom" ? width : height;
|
|
153
|
-
const otherEdge = arrowSide === "top" || arrowSide === "bottom" ? height : width;
|
|
154
|
-
const maxRadius = Math.min(otherEdge / 2, (arrowEdge - arrowWidth) / 2);
|
|
155
|
-
const r = Math.max(0, Math.min(borderRadius, maxRadius));
|
|
156
|
-
const minAc = r + aw;
|
|
157
|
-
const edgeLength = arrowSide === "top" || arrowSide === "bottom" ? width : height;
|
|
158
|
-
let ac = arrowCenter ?? edgeLength / 2;
|
|
159
|
-
ac = Math.max(minAc, Math.min(edgeLength - minAc, ac));
|
|
160
|
-
const edgeLen = Math.sqrt(aw * aw + ah * ah);
|
|
161
|
-
const tipR = r > 0 && edgeLen > 0 ? Math.min(r * ARROW_TIP_RADIUS_FRACTION, edgeLen / 2) : 0;
|
|
162
|
-
const daw = edgeLen > 0 ? aw / edgeLen : 0;
|
|
163
|
-
const dah = edgeLen > 0 ? ah / edgeLen : 0;
|
|
164
|
-
const d = [];
|
|
165
|
-
d.push(`M ${r + ox} ${oy}`);
|
|
166
|
-
if (arrowSide === "top") {
|
|
167
|
-
d.push(`L ${ac - aw + ox} ${oy}`);
|
|
168
|
-
if (tipR > 0) {
|
|
169
|
-
d.push(`L ${ac - tipR * daw + ox} ${-ah + tipR * dah + oy}`);
|
|
170
|
-
d.push(`Q ${ac + ox} ${-ah + oy} ${ac + tipR * daw + ox} ${-ah + tipR * dah + oy}`);
|
|
171
|
-
} else d.push(`L ${ac + ox} ${-ah + oy}`);
|
|
172
|
-
d.push(`L ${ac + aw + ox} ${oy}`);
|
|
173
|
-
}
|
|
174
|
-
d.push(`L ${width - r + ox} ${oy}`);
|
|
175
|
-
d.push(`A ${r} ${r} 0 0 1 ${width + ox} ${r + oy}`);
|
|
176
|
-
if (arrowSide === "right") {
|
|
177
|
-
d.push(`L ${width + ox} ${ac - aw + oy}`);
|
|
178
|
-
if (tipR > 0) {
|
|
179
|
-
d.push(`L ${width + ah - tipR * dah + ox} ${ac - tipR * daw + oy}`);
|
|
180
|
-
d.push(`Q ${width + ah + ox} ${ac + oy} ${width + ah - tipR * dah + ox} ${ac + tipR * daw + oy}`);
|
|
181
|
-
} else d.push(`L ${width + ah + ox} ${ac + oy}`);
|
|
182
|
-
d.push(`L ${width + ox} ${ac + aw + oy}`);
|
|
183
|
-
}
|
|
184
|
-
d.push(`L ${width + ox} ${height - r + oy}`);
|
|
185
|
-
d.push(`A ${r} ${r} 0 0 1 ${width - r + ox} ${height + oy}`);
|
|
186
|
-
if (arrowSide === "bottom") {
|
|
187
|
-
d.push(`L ${ac + aw + ox} ${height + oy}`);
|
|
188
|
-
if (tipR > 0) {
|
|
189
|
-
d.push(`L ${ac + tipR * daw + ox} ${height + ah - tipR * dah + oy}`);
|
|
190
|
-
d.push(`Q ${ac + ox} ${height + ah + oy} ${ac - tipR * daw + ox} ${height + ah - tipR * dah + oy}`);
|
|
191
|
-
} else d.push(`L ${ac + ox} ${height + ah + oy}`);
|
|
192
|
-
d.push(`L ${ac - aw + ox} ${height + oy}`);
|
|
193
|
-
}
|
|
194
|
-
d.push(`L ${r + ox} ${height + oy}`);
|
|
195
|
-
d.push(`A ${r} ${r} 0 0 1 ${ox} ${height - r + oy}`);
|
|
196
|
-
if (arrowSide === "left") {
|
|
197
|
-
d.push(`L ${ox} ${ac + aw + oy}`);
|
|
198
|
-
if (tipR > 0) {
|
|
199
|
-
d.push(`L ${-ah + tipR * dah + ox} ${ac + tipR * daw + oy}`);
|
|
200
|
-
d.push(`Q ${-ah + ox} ${ac + oy} ${-ah + tipR * dah + ox} ${ac - tipR * daw + oy}`);
|
|
201
|
-
} else d.push(`L ${-ah + ox} ${ac + oy}`);
|
|
202
|
-
d.push(`L ${ox} ${ac - aw + oy}`);
|
|
203
|
-
}
|
|
204
|
-
d.push(`L ${ox} ${r + oy}`);
|
|
205
|
-
d.push(`A ${r} ${r} 0 0 1 ${r + ox} ${oy}`);
|
|
206
|
-
d.push("Z");
|
|
207
|
-
return d.join(" ");
|
|
208
|
-
}
|
|
209
|
-
/**
|
|
210
|
-
* Computes the pixel offset the tooltip must shift so that the SVG arrow
|
|
211
|
-
* (after clamping) visually aligns with the Ariakit arrow's actual position.
|
|
212
|
-
*
|
|
213
|
-
* When the desired `arrowCenter` falls inside the safe zone the delta is 0.
|
|
214
|
-
* When it falls outside (e.g. a tiny trigger near a rounded corner), the
|
|
215
|
-
* returned delta tells the caller how far to translate the tooltip element
|
|
216
|
-
* so the clamped arrow ends up over the trigger center.
|
|
217
|
-
*/
|
|
218
|
-
function getArrowClampDelta({ width, height, placement, borderRadius, arrowCenter, arrowWidth = ARROW_WIDTH }) {
|
|
219
|
-
const aw = arrowWidth / 2;
|
|
220
|
-
const side = getArrowSide(placement);
|
|
221
|
-
const arrowEdge = side === "top" || side === "bottom" ? width : height;
|
|
222
|
-
const otherEdge = side === "top" || side === "bottom" ? height : width;
|
|
223
|
-
const maxRadius = Math.min(otherEdge / 2, (arrowEdge - arrowWidth) / 2);
|
|
224
|
-
const minAc = Math.max(0, Math.min(borderRadius, maxRadius)) + aw;
|
|
225
|
-
const maxAc = arrowEdge - minAc;
|
|
226
|
-
let delta = 0;
|
|
227
|
-
if (arrowCenter < minAc) delta = arrowCenter - minAc;
|
|
228
|
-
else if (arrowCenter > maxAc) delta = arrowCenter - maxAc;
|
|
229
|
-
if (side === "top" || side === "bottom") return {
|
|
230
|
-
x: delta,
|
|
231
|
-
y: 0
|
|
232
|
-
};
|
|
233
|
-
return {
|
|
234
|
-
x: 0,
|
|
235
|
-
y: delta
|
|
236
|
-
};
|
|
237
|
-
}
|
|
238
|
-
|
|
239
|
-
//#endregion
|
|
240
|
-
export { ARROW_HEIGHT, ARROW_TIP_RADIUS_FRACTION, ARROW_WIDTH, generateTooltipPath, getArrowClampDelta, getArrowSide, parseShadow };
|
|
@@ -1,29 +0,0 @@
|
|
|
1
|
-
|
|
2
|
-
import React, { PropsWithChildren } from "react";
|
|
3
|
-
import * as react_jsx_runtime0 from "react/jsx-runtime";
|
|
4
|
-
import { PopoverAnchor as PopoverAnchor$1, PopoverArrow as PopoverArrow$1, PopoverDescription as PopoverDescription$1, PopoverDisclosure as PopoverDisclosure$1, PopoverDisclosureArrow as PopoverDisclosureArrow$1, PopoverDismiss as PopoverDismiss$1, PopoverProps as PopoverProps$1, PopoverProvider as PopoverProvider$1, usePopoverStore } from "@ariakit/react";
|
|
5
|
-
|
|
6
|
-
//#region src/components/experimental/client/Popover.d.ts
|
|
7
|
-
interface PopoverHeadingProps extends PropsWithChildren {
|
|
8
|
-
leading?: React.ReactNode;
|
|
9
|
-
trailing?: React.ReactNode;
|
|
10
|
-
}
|
|
11
|
-
declare function PopoverHeading({
|
|
12
|
-
children,
|
|
13
|
-
leading,
|
|
14
|
-
trailing
|
|
15
|
-
}: PopoverHeadingProps): react_jsx_runtime0.JSX.Element;
|
|
16
|
-
declare namespace PopoverHeading {
|
|
17
|
-
var displayName: string;
|
|
18
|
-
}
|
|
19
|
-
type PopoverProps = Omit<PopoverProps$1, 'key'>;
|
|
20
|
-
declare const Popover: (props: PopoverProps$1<"div">) => react_jsx_runtime0.JSX.Element | null;
|
|
21
|
-
declare const PopoverArrow: typeof PopoverArrow$1;
|
|
22
|
-
declare const PopoverAnchor: typeof PopoverAnchor$1;
|
|
23
|
-
declare const PopoverDescription: typeof PopoverDescription$1;
|
|
24
|
-
declare const PopoverDismiss: typeof PopoverDismiss$1;
|
|
25
|
-
declare const PopoverProvider: typeof PopoverProvider$1;
|
|
26
|
-
declare const PopoverDisclosure: typeof PopoverDisclosure$1;
|
|
27
|
-
declare const PopoverDisclosureArrow: typeof PopoverDisclosureArrow$1;
|
|
28
|
-
//#endregion
|
|
29
|
-
export { Popover, PopoverAnchor, PopoverArrow, PopoverDescription, PopoverDisclosure, PopoverDisclosureArrow, PopoverDismiss, PopoverHeading, type PopoverHeadingProps, type PopoverProps, PopoverProvider, usePopoverStore };
|
|
@@ -1,29 +0,0 @@
|
|
|
1
|
-
|
|
2
|
-
import React, { PropsWithChildren } from "react";
|
|
3
|
-
import * as react_jsx_runtime0 from "react/jsx-runtime";
|
|
4
|
-
import { PopoverAnchor as PopoverAnchor$1, PopoverArrow as PopoverArrow$1, PopoverDescription as PopoverDescription$1, PopoverDisclosure as PopoverDisclosure$1, PopoverDisclosureArrow as PopoverDisclosureArrow$1, PopoverDismiss as PopoverDismiss$1, PopoverProps as PopoverProps$1, PopoverProvider as PopoverProvider$1, usePopoverStore } from "@ariakit/react";
|
|
5
|
-
|
|
6
|
-
//#region src/components/experimental/client/Popover.d.ts
|
|
7
|
-
interface PopoverHeadingProps extends PropsWithChildren {
|
|
8
|
-
leading?: React.ReactNode;
|
|
9
|
-
trailing?: React.ReactNode;
|
|
10
|
-
}
|
|
11
|
-
declare function PopoverHeading({
|
|
12
|
-
children,
|
|
13
|
-
leading,
|
|
14
|
-
trailing
|
|
15
|
-
}: PopoverHeadingProps): react_jsx_runtime0.JSX.Element;
|
|
16
|
-
declare namespace PopoverHeading {
|
|
17
|
-
var displayName: string;
|
|
18
|
-
}
|
|
19
|
-
type PopoverProps = Omit<PopoverProps$1, 'key'>;
|
|
20
|
-
declare const Popover: (props: PopoverProps$1<"div">) => react_jsx_runtime0.JSX.Element | null;
|
|
21
|
-
declare const PopoverArrow: typeof PopoverArrow$1;
|
|
22
|
-
declare const PopoverAnchor: typeof PopoverAnchor$1;
|
|
23
|
-
declare const PopoverDescription: typeof PopoverDescription$1;
|
|
24
|
-
declare const PopoverDismiss: typeof PopoverDismiss$1;
|
|
25
|
-
declare const PopoverProvider: typeof PopoverProvider$1;
|
|
26
|
-
declare const PopoverDisclosure: typeof PopoverDisclosure$1;
|
|
27
|
-
declare const PopoverDisclosureArrow: typeof PopoverDisclosureArrow$1;
|
|
28
|
-
//#endregion
|
|
29
|
-
export { Popover, PopoverAnchor, PopoverArrow, PopoverDescription, PopoverDisclosure, PopoverDisclosureArrow, PopoverDismiss, PopoverHeading, type PopoverHeadingProps, type PopoverProps, PopoverProvider, usePopoverStore };
|