storybook 9.0.8 → 9.0.9
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/bin/index.cjs +54 -61
- package/dist/bin/index.js +45 -52
- package/dist/cli/bin/index.cjs +572 -572
- package/dist/cli/bin/index.js +582 -582
- package/dist/common/index.cjs +677 -684
- package/dist/common/index.d.ts +0 -7
- package/dist/common/index.js +680 -687
- package/dist/core-server/presets/common-manager.js +2545 -2507
- package/dist/csf/index.d.ts +3 -1
- package/dist/instrumenter/index.cjs +958 -934
- package/dist/instrumenter/index.d.ts +1 -0
- package/dist/instrumenter/index.js +933 -908
- package/dist/manager/globals-runtime.js +8514 -8489
- package/dist/manager-api/index.cjs +1 -1
- package/dist/manager-api/index.js +1 -1
- package/dist/preview/runtime.js +7488 -7459
- package/dist/preview-api/index.cjs +4438 -2648
- package/dist/preview-api/index.js +4231 -2435
- package/dist/telemetry/index.cjs +521 -521
- package/dist/telemetry/index.js +526 -526
- package/package.json +1 -185
- package/dist/actions/preview.cjs +0 -159
- package/dist/actions/preview.d.ts +0 -555
- package/dist/actions/preview.js +0 -149
- package/dist/backgrounds/index.cjs +0 -148
- package/dist/backgrounds/index.d.ts +0 -592
- package/dist/backgrounds/index.js +0 -130
- package/dist/backgrounds/preview.cjs +0 -143
- package/dist/backgrounds/preview.d.ts +0 -555
- package/dist/backgrounds/preview.js +0 -127
- package/dist/component-testing/index.cjs +0 -23
- package/dist/component-testing/index.d.ts +0 -3
- package/dist/component-testing/index.js +0 -5
- package/dist/component-testing/preview.cjs +0 -40
- package/dist/component-testing/preview.d.ts +0 -5
- package/dist/component-testing/preview.js +0 -25
- package/dist/controls/preview.cjs +0 -26
- package/dist/controls/preview.d.ts +0 -555
- package/dist/controls/preview.js +0 -9
- package/dist/highlight/preview.cjs +0 -590
- package/dist/highlight/preview.d.ts +0 -555
- package/dist/highlight/preview.js +0 -574
- package/dist/measure/index.cjs +0 -476
- package/dist/measure/index.d.ts +0 -567
- package/dist/measure/index.js +0 -464
- package/dist/measure/preview.cjs +0 -466
- package/dist/measure/preview.d.ts +0 -560
- package/dist/measure/preview.js +0 -450
- package/dist/outline/index.cjs +0 -528
- package/dist/outline/index.d.ts +0 -567
- package/dist/outline/index.js +0 -500
- package/dist/outline/preview.cjs +0 -518
- package/dist/outline/preview.d.ts +0 -560
- package/dist/outline/preview.js +0 -486
- package/dist/test/preview.cjs +0 -73
- package/dist/test/preview.d.ts +0 -555
- package/dist/test/preview.js +0 -66
- package/dist/viewport/preview.cjs +0 -35
- package/dist/viewport/preview.d.ts +0 -569
- package/dist/viewport/preview.js +0 -19
package/dist/measure/preview.cjs
DELETED
|
@@ -1,466 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var v = Object.defineProperty;
|
|
3
|
-
var ft = Object.getOwnPropertyDescriptor;
|
|
4
|
-
var ct = Object.getOwnPropertyNames;
|
|
5
|
-
var mt = Object.prototype.hasOwnProperty;
|
|
6
|
-
var r = (e, t) => v(e, "name", { value: t, configurable: !0 });
|
|
7
|
-
var ut = (e, t) => {
|
|
8
|
-
for (var o in t)
|
|
9
|
-
v(e, o, { get: t[o], enumerable: !0 });
|
|
10
|
-
}, ht = (e, t, o, i) => {
|
|
11
|
-
if (t && typeof t == "object" || typeof t == "function")
|
|
12
|
-
for (let n of ct(t))
|
|
13
|
-
!mt.call(e, n) && n !== o && v(e, n, { get: () => t[n], enumerable: !(i = ft(t, n)) || i.enumerable });
|
|
14
|
-
return e;
|
|
15
|
-
};
|
|
16
|
-
var dt = (e) => ht(v({}, "__esModule", { value: !0 }), e);
|
|
17
|
-
|
|
18
|
-
// src/measure/preview.ts
|
|
19
|
-
var At = {};
|
|
20
|
-
ut(At, {
|
|
21
|
-
decorators: () => J,
|
|
22
|
-
default: () => Pt,
|
|
23
|
-
initialGlobals: () => tt
|
|
24
|
-
});
|
|
25
|
-
module.exports = dt(At);
|
|
26
|
-
var Q = require("storybook/preview-api");
|
|
27
|
-
|
|
28
|
-
// src/measure/constants.ts
|
|
29
|
-
var R = "storybook/measure-addon", Ft = `${R}/tool`, F = "measureEnabled", Wt = {
|
|
30
|
-
RESULT: `${R}/result`,
|
|
31
|
-
REQUEST: `${R}/request`,
|
|
32
|
-
CLEAR: `${R}/clear`
|
|
33
|
-
};
|
|
34
|
-
|
|
35
|
-
// src/measure/withMeasure.ts
|
|
36
|
-
var A = require("storybook/preview-api");
|
|
37
|
-
|
|
38
|
-
// src/measure/box-model/canvas.ts
|
|
39
|
-
var y = require("@storybook/global");
|
|
40
|
-
|
|
41
|
-
// ../node_modules/tiny-invariant/dist/esm/tiny-invariant.js
|
|
42
|
-
var pt = process.env.NODE_ENV === "production", D = "Invariant failed";
|
|
43
|
-
function M(e, t) {
|
|
44
|
-
if (!e) {
|
|
45
|
-
if (pt)
|
|
46
|
-
throw new Error(D);
|
|
47
|
-
var o = typeof t == "function" ? t() : t, i = o ? "".concat(D, ": ").concat(o) : D;
|
|
48
|
-
throw new Error(i);
|
|
49
|
-
}
|
|
50
|
-
}
|
|
51
|
-
r(M, "invariant");
|
|
52
|
-
|
|
53
|
-
// src/measure/box-model/canvas.ts
|
|
54
|
-
function W() {
|
|
55
|
-
let e = y.global.document.documentElement, t = Math.max(e.scrollHeight, e.offsetHeight);
|
|
56
|
-
return { width: Math.max(e.scrollWidth, e.offsetWidth), height: t };
|
|
57
|
-
}
|
|
58
|
-
r(W, "getDocumentWidthAndHeight");
|
|
59
|
-
function bt() {
|
|
60
|
-
let e = y.global.document.createElement("canvas");
|
|
61
|
-
e.id = "storybook-addon-measure";
|
|
62
|
-
let t = e.getContext("2d");
|
|
63
|
-
M(t != null);
|
|
64
|
-
let { width: o, height: i } = W();
|
|
65
|
-
return k(e, t, { width: o, height: i }), e.style.position = "absolute", e.style.left = "0", e.style.top = "0", e.style.zIndex = "214748364\
|
|
66
|
-
7", e.style.pointerEvents = "none", y.global.document.body.appendChild(e), { canvas: e, context: t, width: o, height: i };
|
|
67
|
-
}
|
|
68
|
-
r(bt, "createCanvas");
|
|
69
|
-
function k(e, t, { width: o, height: i }) {
|
|
70
|
-
e.style.width = `${o}px`, e.style.height = `${i}px`;
|
|
71
|
-
let n = y.global.window.devicePixelRatio;
|
|
72
|
-
e.width = Math.floor(o * n), e.height = Math.floor(i * n), t.scale(n, n);
|
|
73
|
-
}
|
|
74
|
-
r(k, "setCanvasWidthAndHeight");
|
|
75
|
-
var m = {};
|
|
76
|
-
function Y() {
|
|
77
|
-
m.canvas || (m = bt());
|
|
78
|
-
}
|
|
79
|
-
r(Y, "init");
|
|
80
|
-
function B() {
|
|
81
|
-
m.context && m.context.clearRect(0, 0, m.width ?? 0, m.height ?? 0);
|
|
82
|
-
}
|
|
83
|
-
r(B, "clear");
|
|
84
|
-
function z(e) {
|
|
85
|
-
B(), e(m.context);
|
|
86
|
-
}
|
|
87
|
-
r(z, "draw");
|
|
88
|
-
function X() {
|
|
89
|
-
M(m.canvas, "Canvas should exist in the state."), M(m.context, "Context should exist in the state."), k(m.canvas, m.context, { width: 0, height: 0 });
|
|
90
|
-
let { width: e, height: t } = W();
|
|
91
|
-
k(m.canvas, m.context, { width: e, height: t }), m.width = e, m.height = t;
|
|
92
|
-
}
|
|
93
|
-
r(X, "rescale");
|
|
94
|
-
function $() {
|
|
95
|
-
m.canvas && (B(), m.canvas.parentNode?.removeChild(m.canvas), m = {});
|
|
96
|
-
}
|
|
97
|
-
r($, "destroy");
|
|
98
|
-
|
|
99
|
-
// src/measure/box-model/visualizer.ts
|
|
100
|
-
var b = require("@storybook/global");
|
|
101
|
-
|
|
102
|
-
// src/measure/box-model/labels.ts
|
|
103
|
-
var w = {
|
|
104
|
-
margin: "#f6b26b",
|
|
105
|
-
border: "#ffe599",
|
|
106
|
-
padding: "#93c47d",
|
|
107
|
-
content: "#6fa8dc",
|
|
108
|
-
text: "#232020"
|
|
109
|
-
}, g = 6;
|
|
110
|
-
function N(e, { x: t, y: o, w: i, h: n, r: l }) {
|
|
111
|
-
t = t - i / 2, o = o - n / 2, i < 2 * l && (l = i / 2), n < 2 * l && (l = n / 2), e.beginPath(), e.moveTo(t + l, o), e.arcTo(t + i, o, t +
|
|
112
|
-
i, o + n, l), e.arcTo(t + i, o + n, t, o + n, l), e.arcTo(t, o + n, t, o, l), e.arcTo(t, o, t + i, o, l), e.closePath();
|
|
113
|
-
}
|
|
114
|
-
r(N, "roundedRect");
|
|
115
|
-
function gt(e, { padding: t, border: o, width: i, height: n, top: l, left: a }) {
|
|
116
|
-
let s = i - o.left - o.right - t.left - t.right, f = n - t.top - t.bottom - o.top - o.bottom, c = a + o.left + t.left, u = l + o.top + t.top;
|
|
117
|
-
return e === "top" ? c += s / 2 : e === "right" ? (c += s, u += f / 2) : e === "bottom" ? (c += s / 2, u += f) : e === "left" ? u += f / 2 :
|
|
118
|
-
e === "center" && (c += s / 2, u += f / 2), { x: c, y: u };
|
|
119
|
-
}
|
|
120
|
-
r(gt, "positionCoordinate");
|
|
121
|
-
function wt(e, t, { margin: o, border: i, padding: n }, l, a) {
|
|
122
|
-
let s = /* @__PURE__ */ r((h) => 0, "shift"), f = 0, c = 0, u = a ? 1 : 0.5, d = a ? l * 2 : 0;
|
|
123
|
-
return e === "padding" ? s = /* @__PURE__ */ r((h) => n[h] * u + d, "shift") : e === "border" ? s = /* @__PURE__ */ r((h) => n[h] + i[h] *
|
|
124
|
-
u + d, "shift") : e === "margin" && (s = /* @__PURE__ */ r((h) => n[h] + i[h] + o[h] * u + d, "shift")), t === "top" ? c = -s("top") : t ===
|
|
125
|
-
"right" ? f = s("right") : t === "bottom" ? c = s("bottom") : t === "left" && (f = -s("left")), { offsetX: f, offsetY: c };
|
|
126
|
-
}
|
|
127
|
-
r(wt, "offset");
|
|
128
|
-
function Lt(e, t) {
|
|
129
|
-
return Math.abs(e.x - t.x) < Math.abs(e.w + t.w) / 2 && Math.abs(e.y - t.y) < Math.abs(e.h + t.h) / 2;
|
|
130
|
-
}
|
|
131
|
-
r(Lt, "collide");
|
|
132
|
-
function Et(e, t, o) {
|
|
133
|
-
return e === "top" ? t.y = o.y - o.h - g : e === "right" ? t.x = o.x + o.w / 2 + g + t.w / 2 : e === "bottom" ? t.y = o.y + o.h + g : e ===
|
|
134
|
-
"left" && (t.x = o.x - o.w / 2 - g - t.w / 2), { x: t.x, y: t.y };
|
|
135
|
-
}
|
|
136
|
-
r(Et, "overlapAdjustment");
|
|
137
|
-
function O(e, t, { x: o, y: i, w: n, h: l }, a) {
|
|
138
|
-
return N(e, { x: o, y: i, w: n, h: l, r: 3 }), e.fillStyle = `${w[t]}dd`, e.fill(), e.strokeStyle = w[t], e.stroke(), e.fillStyle = w.text,
|
|
139
|
-
e.fillText(a, o, i), N(e, { x: o, y: i, w: n, h: l, r: 3 }), e.fillStyle = `${w[t]}dd`, e.fill(), e.strokeStyle = w[t], e.stroke(), e.fillStyle =
|
|
140
|
-
w.text, e.fillText(a, o, i), { x: o, y: i, w: n, h: l };
|
|
141
|
-
}
|
|
142
|
-
r(O, "textWithRect");
|
|
143
|
-
function I(e, t) {
|
|
144
|
-
e.font = "600 12px monospace", e.textBaseline = "middle", e.textAlign = "center";
|
|
145
|
-
let o = e.measureText(t), i = o.actualBoundingBoxAscent + o.actualBoundingBoxDescent, n = o.width + g * 2, l = i + g * 2;
|
|
146
|
-
return { w: n, h: l };
|
|
147
|
-
}
|
|
148
|
-
r(I, "configureText");
|
|
149
|
-
function yt(e, t, { type: o, position: i = "center", text: n }, l, a = !1) {
|
|
150
|
-
let { x: s, y: f } = gt(i, t), { offsetX: c, offsetY: u } = wt(o, i, t, g + 1, a);
|
|
151
|
-
s += c, f += u;
|
|
152
|
-
let { w: d, h } = I(e, n);
|
|
153
|
-
if (l && Lt({ x: s, y: f, w: d, h }, l)) {
|
|
154
|
-
let C = Et(i, { x: s, y: f, w: d, h }, l);
|
|
155
|
-
s = C.x, f = C.y;
|
|
156
|
-
}
|
|
157
|
-
return O(e, o, { x: s, y: f, w: d, h }, n);
|
|
158
|
-
}
|
|
159
|
-
r(yt, "drawLabel");
|
|
160
|
-
function St(e, { w: t, h: o }) {
|
|
161
|
-
let i = t * 0.5 + g, n = o * 0.5 + g;
|
|
162
|
-
return {
|
|
163
|
-
offsetX: (e.x === "left" ? -1 : 1) * i,
|
|
164
|
-
offsetY: (e.y === "top" ? -1 : 1) * n
|
|
165
|
-
};
|
|
166
|
-
}
|
|
167
|
-
r(St, "floatingOffset");
|
|
168
|
-
function Ct(e, t, { type: o, text: i }) {
|
|
169
|
-
let { floatingAlignment: n, extremities: l } = t, a = l[n.x], s = l[n.y], { w: f, h: c } = I(e, i), { offsetX: u, offsetY: d } = St(n, {
|
|
170
|
-
w: f,
|
|
171
|
-
h: c
|
|
172
|
-
});
|
|
173
|
-
return a += u, s += d, O(e, o, { x: a, y: s, w: f, h: c }, i);
|
|
174
|
-
}
|
|
175
|
-
r(Ct, "drawFloatingLabel");
|
|
176
|
-
function S(e, t, o, i) {
|
|
177
|
-
let n = [];
|
|
178
|
-
o.forEach((l, a) => {
|
|
179
|
-
let s = i && l.position === "center" ? Ct(e, t, l) : yt(e, t, l, n[a - 1], i);
|
|
180
|
-
n[a] = s;
|
|
181
|
-
});
|
|
182
|
-
}
|
|
183
|
-
r(S, "drawStack");
|
|
184
|
-
function _(e, t, o, i) {
|
|
185
|
-
let n = o.reduce((l, a) => (Object.prototype.hasOwnProperty.call(l, a.position) || (l[a.position] = []), l[a.position]?.push(a), l), {});
|
|
186
|
-
n.top && S(e, t, n.top, i), n.right && S(e, t, n.right, i), n.bottom && S(e, t, n.bottom, i), n.left && S(e, t, n.left, i), n.center && S(
|
|
187
|
-
e, t, n.center, i);
|
|
188
|
-
}
|
|
189
|
-
r(_, "labelStacks");
|
|
190
|
-
|
|
191
|
-
// src/measure/box-model/visualizer.ts
|
|
192
|
-
var x = {
|
|
193
|
-
margin: "#f6b26ba8",
|
|
194
|
-
border: "#ffe599a8",
|
|
195
|
-
padding: "#93c47d8c",
|
|
196
|
-
content: "#6fa8dca8"
|
|
197
|
-
}, q = 30;
|
|
198
|
-
function p(e) {
|
|
199
|
-
return parseInt(e.replace("px", ""), 10);
|
|
200
|
-
}
|
|
201
|
-
r(p, "pxToNumber");
|
|
202
|
-
function L(e) {
|
|
203
|
-
return Number.isInteger(e) ? e : e.toFixed(2);
|
|
204
|
-
}
|
|
205
|
-
r(L, "round");
|
|
206
|
-
function P(e) {
|
|
207
|
-
return e.filter((t) => t.text !== 0 && t.text !== "0");
|
|
208
|
-
}
|
|
209
|
-
r(P, "filterZeroValues");
|
|
210
|
-
function vt(e) {
|
|
211
|
-
let t = {
|
|
212
|
-
top: b.global.window.scrollY,
|
|
213
|
-
bottom: b.global.window.scrollY + b.global.window.innerHeight,
|
|
214
|
-
left: b.global.window.scrollX,
|
|
215
|
-
right: b.global.window.scrollX + b.global.window.innerWidth
|
|
216
|
-
}, o = {
|
|
217
|
-
top: Math.abs(t.top - e.top),
|
|
218
|
-
bottom: Math.abs(t.bottom - e.bottom),
|
|
219
|
-
left: Math.abs(t.left - e.left),
|
|
220
|
-
right: Math.abs(t.right - e.right)
|
|
221
|
-
};
|
|
222
|
-
return {
|
|
223
|
-
x: o.left > o.right ? "left" : "right",
|
|
224
|
-
y: o.top > o.bottom ? "top" : "bottom"
|
|
225
|
-
};
|
|
226
|
-
}
|
|
227
|
-
r(vt, "floatingAlignment");
|
|
228
|
-
function Rt(e) {
|
|
229
|
-
let t = b.global.getComputedStyle(e), { top: o, left: i, right: n, bottom: l, width: a, height: s } = e.getBoundingClientRect(), {
|
|
230
|
-
marginTop: f,
|
|
231
|
-
marginBottom: c,
|
|
232
|
-
marginLeft: u,
|
|
233
|
-
marginRight: d,
|
|
234
|
-
paddingTop: h,
|
|
235
|
-
paddingBottom: C,
|
|
236
|
-
paddingLeft: et,
|
|
237
|
-
paddingRight: ot,
|
|
238
|
-
borderBottomWidth: nt,
|
|
239
|
-
borderTopWidth: it,
|
|
240
|
-
borderLeftWidth: lt,
|
|
241
|
-
borderRightWidth: rt
|
|
242
|
-
} = t;
|
|
243
|
-
o = o + b.global.window.scrollY, i = i + b.global.window.scrollX, l = l + b.global.window.scrollY, n = n + b.global.window.scrollX;
|
|
244
|
-
let E = {
|
|
245
|
-
top: p(f),
|
|
246
|
-
bottom: p(c),
|
|
247
|
-
left: p(u),
|
|
248
|
-
right: p(d)
|
|
249
|
-
}, at = {
|
|
250
|
-
top: p(h),
|
|
251
|
-
bottom: p(C),
|
|
252
|
-
left: p(et),
|
|
253
|
-
right: p(ot)
|
|
254
|
-
}, st = {
|
|
255
|
-
top: p(it),
|
|
256
|
-
bottom: p(nt),
|
|
257
|
-
left: p(lt),
|
|
258
|
-
right: p(rt)
|
|
259
|
-
}, H = {
|
|
260
|
-
top: o - E.top,
|
|
261
|
-
bottom: l + E.bottom,
|
|
262
|
-
left: i - E.left,
|
|
263
|
-
right: n + E.right
|
|
264
|
-
};
|
|
265
|
-
return {
|
|
266
|
-
margin: E,
|
|
267
|
-
padding: at,
|
|
268
|
-
border: st,
|
|
269
|
-
top: o,
|
|
270
|
-
left: i,
|
|
271
|
-
bottom: l,
|
|
272
|
-
right: n,
|
|
273
|
-
width: a,
|
|
274
|
-
height: s,
|
|
275
|
-
extremities: H,
|
|
276
|
-
floatingAlignment: vt(H)
|
|
277
|
-
};
|
|
278
|
-
}
|
|
279
|
-
r(Rt, "measureElement");
|
|
280
|
-
function Mt(e, { margin: t, width: o, height: i, top: n, left: l, bottom: a, right: s }) {
|
|
281
|
-
let f = i + t.bottom + t.top;
|
|
282
|
-
e.fillStyle = x.margin, e.fillRect(l, n - t.top, o, t.top), e.fillRect(s, n - t.top, t.right, f), e.fillRect(l, a, o, t.bottom), e.fillRect(
|
|
283
|
-
l - t.left, n - t.top, t.left, f);
|
|
284
|
-
let c = [
|
|
285
|
-
{
|
|
286
|
-
type: "margin",
|
|
287
|
-
text: L(t.top),
|
|
288
|
-
position: "top"
|
|
289
|
-
},
|
|
290
|
-
{
|
|
291
|
-
type: "margin",
|
|
292
|
-
text: L(t.right),
|
|
293
|
-
position: "right"
|
|
294
|
-
},
|
|
295
|
-
{
|
|
296
|
-
type: "margin",
|
|
297
|
-
text: L(t.bottom),
|
|
298
|
-
position: "bottom"
|
|
299
|
-
},
|
|
300
|
-
{
|
|
301
|
-
type: "margin",
|
|
302
|
-
text: L(t.left),
|
|
303
|
-
position: "left"
|
|
304
|
-
}
|
|
305
|
-
];
|
|
306
|
-
return P(c);
|
|
307
|
-
}
|
|
308
|
-
r(Mt, "drawMargin");
|
|
309
|
-
function xt(e, { padding: t, border: o, width: i, height: n, top: l, left: a, bottom: s, right: f }) {
|
|
310
|
-
let c = i - o.left - o.right, u = n - t.top - t.bottom - o.top - o.bottom;
|
|
311
|
-
e.fillStyle = x.padding, e.fillRect(a + o.left, l + o.top, c, t.top), e.fillRect(
|
|
312
|
-
f - t.right - o.right,
|
|
313
|
-
l + t.top + o.top,
|
|
314
|
-
t.right,
|
|
315
|
-
u
|
|
316
|
-
), e.fillRect(
|
|
317
|
-
a + o.left,
|
|
318
|
-
s - t.bottom - o.bottom,
|
|
319
|
-
c,
|
|
320
|
-
t.bottom
|
|
321
|
-
), e.fillRect(a + o.left, l + t.top + o.top, t.left, u);
|
|
322
|
-
let d = [
|
|
323
|
-
{
|
|
324
|
-
type: "padding",
|
|
325
|
-
text: t.top,
|
|
326
|
-
position: "top"
|
|
327
|
-
},
|
|
328
|
-
{
|
|
329
|
-
type: "padding",
|
|
330
|
-
text: t.right,
|
|
331
|
-
position: "right"
|
|
332
|
-
},
|
|
333
|
-
{
|
|
334
|
-
type: "padding",
|
|
335
|
-
text: t.bottom,
|
|
336
|
-
position: "bottom"
|
|
337
|
-
},
|
|
338
|
-
{
|
|
339
|
-
type: "padding",
|
|
340
|
-
text: t.left,
|
|
341
|
-
position: "left"
|
|
342
|
-
}
|
|
343
|
-
];
|
|
344
|
-
return P(d);
|
|
345
|
-
}
|
|
346
|
-
r(xt, "drawPadding");
|
|
347
|
-
function Tt(e, { border: t, width: o, height: i, top: n, left: l, bottom: a, right: s }) {
|
|
348
|
-
let f = i - t.top - t.bottom;
|
|
349
|
-
e.fillStyle = x.border, e.fillRect(l, n, o, t.top), e.fillRect(l, a - t.bottom, o, t.bottom), e.fillRect(l, n + t.top, t.left, f), e.fillRect(
|
|
350
|
-
s - t.right, n + t.top, t.right, f);
|
|
351
|
-
let c = [
|
|
352
|
-
{
|
|
353
|
-
type: "border",
|
|
354
|
-
text: t.top,
|
|
355
|
-
position: "top"
|
|
356
|
-
},
|
|
357
|
-
{
|
|
358
|
-
type: "border",
|
|
359
|
-
text: t.right,
|
|
360
|
-
position: "right"
|
|
361
|
-
},
|
|
362
|
-
{
|
|
363
|
-
type: "border",
|
|
364
|
-
text: t.bottom,
|
|
365
|
-
position: "bottom"
|
|
366
|
-
},
|
|
367
|
-
{
|
|
368
|
-
type: "border",
|
|
369
|
-
text: t.left,
|
|
370
|
-
position: "left"
|
|
371
|
-
}
|
|
372
|
-
];
|
|
373
|
-
return P(c);
|
|
374
|
-
}
|
|
375
|
-
r(Tt, "drawBorder");
|
|
376
|
-
function Dt(e, { padding: t, border: o, width: i, height: n, top: l, left: a }) {
|
|
377
|
-
let s = i - o.left - o.right - t.left - t.right, f = n - t.top - t.bottom - o.top - o.bottom;
|
|
378
|
-
return e.fillStyle = x.content, e.fillRect(
|
|
379
|
-
a + o.left + t.left,
|
|
380
|
-
l + o.top + t.top,
|
|
381
|
-
s,
|
|
382
|
-
f
|
|
383
|
-
), [
|
|
384
|
-
{
|
|
385
|
-
type: "content",
|
|
386
|
-
position: "center",
|
|
387
|
-
text: `${L(s)} x ${L(f)}`
|
|
388
|
-
}
|
|
389
|
-
];
|
|
390
|
-
}
|
|
391
|
-
r(Dt, "drawContent");
|
|
392
|
-
function kt(e) {
|
|
393
|
-
return (t) => {
|
|
394
|
-
if (e && t) {
|
|
395
|
-
let o = Rt(e), i = Mt(t, o), n = xt(t, o), l = Tt(t, o), a = Dt(t, o), s = o.width <= q * 3 || o.height <= q;
|
|
396
|
-
_(
|
|
397
|
-
t,
|
|
398
|
-
o,
|
|
399
|
-
[...a, ...n, ...l, ...i],
|
|
400
|
-
s
|
|
401
|
-
);
|
|
402
|
-
}
|
|
403
|
-
};
|
|
404
|
-
}
|
|
405
|
-
r(kt, "drawBoxModel");
|
|
406
|
-
function j(e) {
|
|
407
|
-
z(kt(e));
|
|
408
|
-
}
|
|
409
|
-
r(j, "drawSelectedElement");
|
|
410
|
-
|
|
411
|
-
// src/measure/util.ts
|
|
412
|
-
var G = require("@storybook/global");
|
|
413
|
-
var U = /* @__PURE__ */ r((e, t) => {
|
|
414
|
-
let o = G.global.document.elementFromPoint(e, t), i = /* @__PURE__ */ r((l) => {
|
|
415
|
-
if (l && l.shadowRoot) {
|
|
416
|
-
let a = l.shadowRoot.elementFromPoint(e, t);
|
|
417
|
-
return l.isEqualNode(a) ? l : a.shadowRoot ? i(a) : a;
|
|
418
|
-
}
|
|
419
|
-
return l;
|
|
420
|
-
}, "crawlShadows");
|
|
421
|
-
return i(o) || o;
|
|
422
|
-
}, "deepElementFromPoint");
|
|
423
|
-
|
|
424
|
-
// src/measure/withMeasure.ts
|
|
425
|
-
var V, T = { x: 0, y: 0 };
|
|
426
|
-
function K(e, t) {
|
|
427
|
-
V = U(e, t), j(V);
|
|
428
|
-
}
|
|
429
|
-
r(K, "findAndDrawElement");
|
|
430
|
-
var Z = /* @__PURE__ */ r((e, t) => {
|
|
431
|
-
let { measureEnabled: o } = t.globals || {};
|
|
432
|
-
return (0, A.useEffect)(() => {
|
|
433
|
-
if (typeof globalThis.document > "u")
|
|
434
|
-
return;
|
|
435
|
-
let i = /* @__PURE__ */ r((n) => {
|
|
436
|
-
window.requestAnimationFrame(() => {
|
|
437
|
-
n.stopPropagation(), T.x = n.clientX, T.y = n.clientY;
|
|
438
|
-
});
|
|
439
|
-
}, "onPointerMove");
|
|
440
|
-
return globalThis.document.addEventListener("pointermove", i), () => {
|
|
441
|
-
globalThis.document.removeEventListener("pointermove", i);
|
|
442
|
-
};
|
|
443
|
-
}, []), (0, A.useEffect)(() => {
|
|
444
|
-
let i = /* @__PURE__ */ r((l) => {
|
|
445
|
-
window.requestAnimationFrame(() => {
|
|
446
|
-
l.stopPropagation(), K(l.clientX, l.clientY);
|
|
447
|
-
});
|
|
448
|
-
}, "onPointerOver"), n = /* @__PURE__ */ r(() => {
|
|
449
|
-
window.requestAnimationFrame(() => {
|
|
450
|
-
X();
|
|
451
|
-
});
|
|
452
|
-
}, "onResize");
|
|
453
|
-
return t.viewMode === "story" && o && (globalThis.document.addEventListener("pointerover", i), Y(), globalThis.window.addEventListener("\
|
|
454
|
-
resize", n), K(T.x, T.y)), () => {
|
|
455
|
-
globalThis.window.removeEventListener("resize", n), $();
|
|
456
|
-
};
|
|
457
|
-
}, [o, t.viewMode]), e();
|
|
458
|
-
}, "withMeasure");
|
|
459
|
-
|
|
460
|
-
// src/measure/preview.ts
|
|
461
|
-
var J = globalThis.FEATURES?.measure ? [Z] : [], tt = {
|
|
462
|
-
[F]: !1
|
|
463
|
-
}, Pt = /* @__PURE__ */ r(() => (0, Q.definePreview)({
|
|
464
|
-
decorators: J,
|
|
465
|
-
initialGlobals: tt
|
|
466
|
-
}), "default");
|