storybook 9.0.0-alpha.20 → 9.0.0-alpha.21
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/assets/server/base-preview-head.html +1 -3
- package/dist/actions/decorator.js +34 -38
- package/dist/actions/index.cjs +1 -4
- package/dist/actions/index.js +1 -4
- package/dist/actions/preview.cjs +1 -4
- package/dist/actions/preview.js +1 -4
- package/dist/babel/index.cjs +822 -816
- package/dist/babel/index.js +822 -816
- package/dist/backgrounds/index.cjs +16 -16
- package/dist/backgrounds/index.js +14 -14
- package/dist/backgrounds/preview.cjs +34 -34
- package/dist/backgrounds/preview.js +29 -29
- package/dist/bin/index.cjs +67 -65
- package/dist/bin/index.js +61 -59
- package/dist/builder-manager/index.cjs +482 -472
- package/dist/builder-manager/index.js +283 -273
- package/dist/channels/index.js +941 -919
- package/dist/cli/bin/index.cjs +1 -1
- package/dist/cli/bin/index.js +1 -1
- package/dist/cli/index.cjs +61752 -7591
- package/dist/cli/index.d.ts +22 -14
- package/dist/cli/index.js +61775 -7614
- package/dist/common/index.cjs +16015 -8979
- package/dist/common/index.d.ts +30 -1
- package/dist/common/index.js +16105 -9063
- package/dist/components/index.cjs +3694 -3643
- package/dist/components/index.d.ts +5 -2
- package/dist/components/index.js +2352 -2294
- package/dist/core-server/index.cjs +3540 -3540
- package/dist/core-server/index.js +730 -730
- package/dist/core-server/presets/common-manager.js +2642 -2592
- package/dist/core-server/presets/common-preset.cjs +723 -715
- package/dist/core-server/presets/common-preset.js +10 -2
- package/dist/docs-tools/index.js +640 -632
- package/dist/highlight/index.cjs +16 -16
- package/dist/highlight/index.d.ts +45 -1
- package/dist/highlight/index.js +2 -2
- package/dist/highlight/preview.cjs +522 -68
- package/dist/highlight/preview.js +508 -56
- package/dist/instrumenter/index.js +1179 -1170
- package/dist/manager/globals-module-info.cjs +1 -0
- package/dist/manager/globals-module-info.js +1 -0
- package/dist/manager/globals-runtime.js +19385 -19190
- package/dist/manager/runtime.js +2084 -2079
- package/dist/manager-api/index.cjs +352 -352
- package/dist/manager-api/index.js +1694 -1663
- package/dist/manager-errors.js +41 -37
- package/dist/measure/index.cjs +99 -97
- package/dist/measure/index.js +95 -93
- package/dist/measure/preview.cjs +127 -125
- package/dist/measure/preview.js +125 -123
- package/dist/outline/index.cjs +41 -41
- package/dist/outline/index.js +12 -12
- package/dist/outline/preview.cjs +23 -23
- package/dist/outline/preview.js +7 -7
- package/dist/preview/runtime.js +13577 -12959
- package/dist/preview-api/index.cjs +0 -1
- package/dist/preview-api/index.d.ts +120 -385
- package/dist/preview-api/index.js +827 -812
- package/dist/preview-errors.cjs +65 -51
- package/dist/preview-errors.d.ts +6 -2
- package/dist/preview-errors.js +176 -142
- package/dist/server-errors.cjs +105 -72
- package/dist/server-errors.d.ts +9 -1
- package/dist/server-errors.js +87 -54
- package/dist/telemetry/index.cjs +374 -370
- package/dist/telemetry/index.js +460 -456
- package/dist/test/index.js +9831 -9743
- package/dist/test/preview.d.ts +0 -6
- package/dist/test/preview.js +3628 -3568
- package/dist/types/index.d.ts +72 -6
- package/package.json +1 -1
package/dist/manager-errors.js
CHANGED
|
@@ -1,18 +1,18 @@
|
|
|
1
|
-
var
|
|
2
|
-
var
|
|
1
|
+
var y = Object.defineProperty;
|
|
2
|
+
var s = (t, o) => y(t, "name", { value: o, configurable: !0 });
|
|
3
3
|
|
|
4
4
|
// src/storybook-error.ts
|
|
5
|
-
function
|
|
6
|
-
code:
|
|
7
|
-
category:
|
|
5
|
+
function c({
|
|
6
|
+
code: t,
|
|
7
|
+
category: o
|
|
8
8
|
}) {
|
|
9
|
-
let e = String(
|
|
10
|
-
return `SB_${
|
|
9
|
+
let e = String(t).padStart(4, "0");
|
|
10
|
+
return `SB_${o}_${e}`;
|
|
11
11
|
}
|
|
12
|
-
|
|
13
|
-
var
|
|
12
|
+
s(c, "parseErrorCode");
|
|
13
|
+
var n = class t extends Error {
|
|
14
14
|
constructor(e) {
|
|
15
|
-
super(
|
|
15
|
+
super(t.getFullMessage(e));
|
|
16
16
|
/**
|
|
17
17
|
* Data associated with the error. Used to provide additional information in the error message or
|
|
18
18
|
* to be passed to telemetry.
|
|
@@ -22,8 +22,11 @@ var c = class c extends Error {
|
|
|
22
22
|
this.fromStorybook = !0;
|
|
23
23
|
this.category = e.category, this.documentation = e.documentation ?? !1, this.code = e.code;
|
|
24
24
|
}
|
|
25
|
+
static {
|
|
26
|
+
s(this, "StorybookError");
|
|
27
|
+
}
|
|
25
28
|
get fullErrorCode() {
|
|
26
|
-
return
|
|
29
|
+
return c({ code: this.code, category: this.category });
|
|
27
30
|
}
|
|
28
31
|
/** Overrides the default `Error.name` property in the format: SB_<CATEGORY>_<CODE>. */
|
|
29
32
|
get name() {
|
|
@@ -33,27 +36,28 @@ var c = class c extends Error {
|
|
|
33
36
|
/** Generates the error message along with additional documentation link (if applicable). */
|
|
34
37
|
static getFullMessage({
|
|
35
38
|
documentation: e,
|
|
36
|
-
code:
|
|
37
|
-
category:
|
|
38
|
-
message:
|
|
39
|
+
code: d,
|
|
40
|
+
category: E,
|
|
41
|
+
message: l
|
|
39
42
|
}) {
|
|
40
|
-
let
|
|
41
|
-
return e === !0 ?
|
|
42
|
-
(
|
|
43
|
-
${e.map((
|
|
44
|
-
`)}`), `${
|
|
43
|
+
let a;
|
|
44
|
+
return e === !0 ? a = `https://storybook.js.org/error/${c({ code: d, category: E })}` : typeof e == "string" ? a = e : Array.isArray(e) &&
|
|
45
|
+
(a = `
|
|
46
|
+
${e.map((N) => ` - ${N}`).join(`
|
|
47
|
+
`)}`), `${l}${a != null ? `
|
|
45
48
|
|
|
46
|
-
More info: ${
|
|
49
|
+
More info: ${a}
|
|
47
50
|
` : ""}`;
|
|
48
51
|
}
|
|
49
52
|
};
|
|
50
|
-
r(c, "StorybookError");
|
|
51
|
-
var o = c;
|
|
52
53
|
|
|
53
54
|
// src/manager-errors.ts
|
|
54
|
-
var
|
|
55
|
-
"MANAGER_CLIENT-LOGGER",
|
|
56
|
-
_ROUTER",
|
|
55
|
+
var g = /* @__PURE__ */ ((r) => (r.MANAGER_UNCAUGHT = "MANAGER_UNCAUGHT", r.MANAGER_UI = "MANAGER_UI", r.MANAGER_API = "MANAGER_API", r.MANAGER_CLIENT_LOGGER =
|
|
56
|
+
"MANAGER_CLIENT-LOGGER", r.MANAGER_CHANNELS = "MANAGER_CHANNELS", r.MANAGER_CORE_EVENTS = "MANAGER_CORE-EVENTS", r.MANAGER_ROUTER = "MANAGER\
|
|
57
|
+
_ROUTER", r.MANAGER_THEMING = "MANAGER_THEMING", r))(g || {}), A = class extends n {
|
|
58
|
+
static {
|
|
59
|
+
s(this, "ProviderDoesNotExtendBaseProviderError");
|
|
60
|
+
}
|
|
57
61
|
constructor() {
|
|
58
62
|
super({
|
|
59
63
|
category: "MANAGER_UI",
|
|
@@ -61,9 +65,7 @@ _ROUTER", t.MANAGER_THEMING = "MANAGER_THEMING", t))(M || {}), a = class a exten
|
|
|
61
65
|
message: "The Provider passed into Storybook's UI is not extended from the base Provider. Please check your Provider implementation."
|
|
62
66
|
});
|
|
63
67
|
}
|
|
64
|
-
}
|
|
65
|
-
r(a, "ProviderDoesNotExtendBaseProviderError");
|
|
66
|
-
var d = a, u = class u extends o {
|
|
68
|
+
}, u = class extends n {
|
|
67
69
|
constructor(e) {
|
|
68
70
|
super({
|
|
69
71
|
category: "MANAGER_UNCAUGHT",
|
|
@@ -73,9 +75,10 @@ var d = a, u = class u extends o {
|
|
|
73
75
|
this.data = e;
|
|
74
76
|
this.stack = e.error.stack;
|
|
75
77
|
}
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
78
|
+
static {
|
|
79
|
+
s(this, "UncaughtManagerError");
|
|
80
|
+
}
|
|
81
|
+
}, i = class extends n {
|
|
79
82
|
constructor(e) {
|
|
80
83
|
super({
|
|
81
84
|
category: "MANAGER_API",
|
|
@@ -88,12 +91,13 @@ var E = u, i = class i extends o {
|
|
|
88
91
|
});
|
|
89
92
|
this.data = e;
|
|
90
93
|
}
|
|
94
|
+
static {
|
|
95
|
+
s(this, "StatusTypeIdMismatchError");
|
|
96
|
+
}
|
|
91
97
|
};
|
|
92
|
-
r(i, "StatusTypeIdMismatchError");
|
|
93
|
-
var N = i;
|
|
94
98
|
export {
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
+
g as Category,
|
|
100
|
+
A as ProviderDoesNotExtendBaseProviderError,
|
|
101
|
+
i as StatusTypeIdMismatchError,
|
|
102
|
+
u as UncaughtManagerError
|
|
99
103
|
};
|
package/dist/measure/index.cjs
CHANGED
|
@@ -1,31 +1,31 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
var v = Object.defineProperty;
|
|
3
|
-
var
|
|
4
|
-
var
|
|
5
|
-
var
|
|
3
|
+
var ut = Object.getOwnPropertyDescriptor;
|
|
4
|
+
var dt = Object.getOwnPropertyNames;
|
|
5
|
+
var ht = Object.prototype.hasOwnProperty;
|
|
6
6
|
var l = (e, t) => v(e, "name", { value: t, configurable: !0 });
|
|
7
|
-
var
|
|
7
|
+
var W = (e, t) => {
|
|
8
8
|
for (var o in t)
|
|
9
9
|
v(e, o, { get: t[o], enumerable: !0 });
|
|
10
|
-
},
|
|
10
|
+
}, pt = (e, t, o, i) => {
|
|
11
11
|
if (t && typeof t == "object" || typeof t == "function")
|
|
12
|
-
for (let n of
|
|
13
|
-
!
|
|
12
|
+
for (let n of dt(t))
|
|
13
|
+
!ht.call(e, n) && n !== o && v(e, n, { get: () => t[n], enumerable: !(i = ut(t, n)) || i.enumerable });
|
|
14
14
|
return e;
|
|
15
15
|
};
|
|
16
|
-
var bt = (e) =>
|
|
16
|
+
var bt = (e) => pt(v({}, "__esModule", { value: !0 }), e);
|
|
17
17
|
|
|
18
18
|
// src/measure/index.ts
|
|
19
|
-
var
|
|
20
|
-
|
|
21
|
-
default: () =>
|
|
19
|
+
var Wt = {};
|
|
20
|
+
W(Wt, {
|
|
21
|
+
default: () => Ft
|
|
22
22
|
});
|
|
23
|
-
module.exports = bt(
|
|
23
|
+
module.exports = bt(Wt);
|
|
24
24
|
var nt = require("storybook/preview-api");
|
|
25
25
|
|
|
26
26
|
// src/measure/preview.ts
|
|
27
27
|
var H = {};
|
|
28
|
-
|
|
28
|
+
W(H, {
|
|
29
29
|
decorators: () => et,
|
|
30
30
|
default: () => Ht,
|
|
31
31
|
initialGlobals: () => ot
|
|
@@ -43,15 +43,15 @@ var R = "storybook/measure-addon", Bt = `${R}/tool`, Y = "measureEnabled", zt =
|
|
|
43
43
|
var A = require("storybook/preview-api");
|
|
44
44
|
|
|
45
45
|
// src/measure/box-model/canvas.ts
|
|
46
|
-
var
|
|
46
|
+
var y = require("@storybook/global");
|
|
47
47
|
|
|
48
48
|
// ../node_modules/tiny-invariant/dist/esm/tiny-invariant.js
|
|
49
|
-
var gt = process.env.NODE_ENV === "production",
|
|
49
|
+
var gt = process.env.NODE_ENV === "production", D = "Invariant failed";
|
|
50
50
|
function M(e, t) {
|
|
51
51
|
if (!e) {
|
|
52
52
|
if (gt)
|
|
53
|
-
throw new Error(
|
|
54
|
-
var o = typeof t == "function" ? t() : t, i = o ? "".concat(
|
|
53
|
+
throw new Error(D);
|
|
54
|
+
var o = typeof t == "function" ? t() : t, i = o ? "".concat(D, ": ").concat(o) : D;
|
|
55
55
|
throw new Error(i);
|
|
56
56
|
}
|
|
57
57
|
}
|
|
@@ -59,26 +59,26 @@ l(M, "invariant");
|
|
|
59
59
|
|
|
60
60
|
// src/measure/box-model/canvas.ts
|
|
61
61
|
function B() {
|
|
62
|
-
let e =
|
|
62
|
+
let e = y.global.document.documentElement, t = Math.max(e.scrollHeight, e.offsetHeight);
|
|
63
63
|
return { width: Math.max(e.scrollWidth, e.offsetWidth), height: t };
|
|
64
64
|
}
|
|
65
65
|
l(B, "getDocumentWidthAndHeight");
|
|
66
66
|
function wt() {
|
|
67
|
-
let e =
|
|
67
|
+
let e = y.global.document.createElement("canvas");
|
|
68
68
|
e.id = "storybook-addon-measure";
|
|
69
69
|
let t = e.getContext("2d");
|
|
70
70
|
M(t != null);
|
|
71
71
|
let { width: o, height: i } = B();
|
|
72
|
-
return
|
|
73
|
-
7", e.style.pointerEvents = "none",
|
|
72
|
+
return k(e, t, { width: o, height: i }), e.style.position = "absolute", e.style.left = "0", e.style.top = "0", e.style.zIndex = "214748364\
|
|
73
|
+
7", e.style.pointerEvents = "none", y.global.document.body.appendChild(e), { canvas: e, context: t, width: o, height: i };
|
|
74
74
|
}
|
|
75
75
|
l(wt, "createCanvas");
|
|
76
|
-
function
|
|
76
|
+
function k(e, t, { width: o, height: i }) {
|
|
77
77
|
e.style.width = `${o}px`, e.style.height = `${i}px`;
|
|
78
|
-
let n =
|
|
78
|
+
let n = y.global.window.devicePixelRatio;
|
|
79
79
|
e.width = Math.floor(o * n), e.height = Math.floor(i * n), t.scale(n, n);
|
|
80
80
|
}
|
|
81
|
-
l(
|
|
81
|
+
l(k, "setCanvasWidthAndHeight");
|
|
82
82
|
var m = {};
|
|
83
83
|
function z() {
|
|
84
84
|
m.canvas || (m = wt());
|
|
@@ -93,9 +93,9 @@ function $(e) {
|
|
|
93
93
|
}
|
|
94
94
|
l($, "draw");
|
|
95
95
|
function N() {
|
|
96
|
-
M(m.canvas, "Canvas should exist in the state."), M(m.context, "Context should exist in the state."),
|
|
96
|
+
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 });
|
|
97
97
|
let { width: e, height: t } = B();
|
|
98
|
-
|
|
98
|
+
k(m.canvas, m.context, { width: e, height: t }), m.width = e, m.height = t;
|
|
99
99
|
}
|
|
100
100
|
l(N, "rescale");
|
|
101
101
|
function O() {
|
|
@@ -120,22 +120,22 @@ function I(e, { x: t, y: o, w: i, h: n, r }) {
|
|
|
120
120
|
}
|
|
121
121
|
l(I, "roundedRect");
|
|
122
122
|
function Lt(e, { padding: t, border: o, width: i, height: n, top: r, left: a }) {
|
|
123
|
-
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,
|
|
124
|
-
return e === "top" ? c += s / 2 : e === "right" ? (c += s,
|
|
125
|
-
e === "center" && (c += s / 2,
|
|
123
|
+
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 = r + o.top + t.top;
|
|
124
|
+
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 :
|
|
125
|
+
e === "center" && (c += s / 2, u += f / 2), { x: c, y: u };
|
|
126
126
|
}
|
|
127
127
|
l(Lt, "positionCoordinate");
|
|
128
|
-
function
|
|
129
|
-
let s = /* @__PURE__ */ l((
|
|
130
|
-
return e === "padding" ? s = /* @__PURE__ */ l((
|
|
131
|
-
|
|
128
|
+
function Et(e, t, { margin: o, border: i, padding: n }, r, a) {
|
|
129
|
+
let s = /* @__PURE__ */ l((d) => 0, "shift"), f = 0, c = 0, u = a ? 1 : 0.5, h = a ? r * 2 : 0;
|
|
130
|
+
return e === "padding" ? s = /* @__PURE__ */ l((d) => n[d] * u + h, "shift") : e === "border" ? s = /* @__PURE__ */ l((d) => n[d] + i[d] *
|
|
131
|
+
u + h, "shift") : e === "margin" && (s = /* @__PURE__ */ l((d) => n[d] + i[d] + o[d] * u + h, "shift")), t === "top" ? c = -s("top") : t ===
|
|
132
132
|
"right" ? f = s("right") : t === "bottom" ? c = s("bottom") : t === "left" && (f = -s("left")), { offsetX: f, offsetY: c };
|
|
133
133
|
}
|
|
134
|
-
l(
|
|
135
|
-
function
|
|
134
|
+
l(Et, "offset");
|
|
135
|
+
function yt(e, t) {
|
|
136
136
|
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;
|
|
137
137
|
}
|
|
138
|
-
l(
|
|
138
|
+
l(yt, "collide");
|
|
139
139
|
function St(e, t, o) {
|
|
140
140
|
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 ===
|
|
141
141
|
"left" && (t.x = o.x - o.w / 2 - g - t.w / 2), { x: t.x, y: t.y };
|
|
@@ -154,14 +154,14 @@ function q(e, t) {
|
|
|
154
154
|
}
|
|
155
155
|
l(q, "configureText");
|
|
156
156
|
function Ct(e, t, { type: o, position: i = "center", text: n }, r, a = !1) {
|
|
157
|
-
let { x: s, y: f } = Lt(i, t), { offsetX: c, offsetY:
|
|
158
|
-
s += c, f +=
|
|
159
|
-
let { w:
|
|
160
|
-
if (r &&
|
|
161
|
-
let C = St(i, { x: s, y: f, w:
|
|
157
|
+
let { x: s, y: f } = Lt(i, t), { offsetX: c, offsetY: u } = Et(o, i, t, g + 1, a);
|
|
158
|
+
s += c, f += u;
|
|
159
|
+
let { w: h, h: d } = q(e, n);
|
|
160
|
+
if (r && yt({ x: s, y: f, w: h, h: d }, r)) {
|
|
161
|
+
let C = St(i, { x: s, y: f, w: h, h: d }, r);
|
|
162
162
|
s = C.x, f = C.y;
|
|
163
163
|
}
|
|
164
|
-
return _(e, o, { x: s, y: f, w:
|
|
164
|
+
return _(e, o, { x: s, y: f, w: h, h: d }, n);
|
|
165
165
|
}
|
|
166
166
|
l(Ct, "drawLabel");
|
|
167
167
|
function vt(e, { w: t, h: o }) {
|
|
@@ -173,11 +173,11 @@ function vt(e, { w: t, h: o }) {
|
|
|
173
173
|
}
|
|
174
174
|
l(vt, "floatingOffset");
|
|
175
175
|
function Rt(e, t, { type: o, text: i }) {
|
|
176
|
-
let { floatingAlignment: n, extremities: r } = t, a = r[n.x], s = r[n.y], { w: f, h: c } = q(e, i), { offsetX:
|
|
176
|
+
let { floatingAlignment: n, extremities: r } = t, a = r[n.x], s = r[n.y], { w: f, h: c } = q(e, i), { offsetX: u, offsetY: h } = vt(n, {
|
|
177
177
|
w: f,
|
|
178
178
|
h: c
|
|
179
179
|
});
|
|
180
|
-
return a +=
|
|
180
|
+
return a += u, s += h, _(e, o, { x: a, y: s, w: f, h: c }, i);
|
|
181
181
|
}
|
|
182
182
|
l(Rt, "drawFloatingLabel");
|
|
183
183
|
function S(e, t, o, i) {
|
|
@@ -202,10 +202,10 @@ var x = {
|
|
|
202
202
|
padding: "#93c47d8c",
|
|
203
203
|
content: "#6fa8dca8"
|
|
204
204
|
}, G = 30;
|
|
205
|
-
function
|
|
205
|
+
function p(e) {
|
|
206
206
|
return parseInt(e.replace("px", ""), 10);
|
|
207
207
|
}
|
|
208
|
-
l(
|
|
208
|
+
l(p, "pxToNumber");
|
|
209
209
|
function L(e) {
|
|
210
210
|
return Number.isInteger(e) ? e : e.toFixed(2);
|
|
211
211
|
}
|
|
@@ -236,9 +236,9 @@ function xt(e) {
|
|
|
236
236
|
let t = b.global.getComputedStyle(e), { top: o, left: i, right: n, bottom: r, width: a, height: s } = e.getBoundingClientRect(), {
|
|
237
237
|
marginTop: f,
|
|
238
238
|
marginBottom: c,
|
|
239
|
-
marginLeft:
|
|
240
|
-
marginRight:
|
|
241
|
-
paddingTop:
|
|
239
|
+
marginLeft: u,
|
|
240
|
+
marginRight: h,
|
|
241
|
+
paddingTop: d,
|
|
242
242
|
paddingBottom: C,
|
|
243
243
|
paddingLeft: it,
|
|
244
244
|
paddingRight: rt,
|
|
@@ -248,29 +248,29 @@ function xt(e) {
|
|
|
248
248
|
borderRightWidth: ft
|
|
249
249
|
} = t;
|
|
250
250
|
o = o + b.global.window.scrollY, i = i + b.global.window.scrollX, r = r + b.global.window.scrollY, n = n + b.global.window.scrollX;
|
|
251
|
-
let
|
|
252
|
-
top:
|
|
253
|
-
bottom:
|
|
254
|
-
left:
|
|
255
|
-
right: h
|
|
251
|
+
let E = {
|
|
252
|
+
top: p(f),
|
|
253
|
+
bottom: p(c),
|
|
254
|
+
left: p(u),
|
|
255
|
+
right: p(h)
|
|
256
256
|
}, ct = {
|
|
257
|
-
top:
|
|
258
|
-
bottom:
|
|
259
|
-
left:
|
|
260
|
-
right:
|
|
257
|
+
top: p(d),
|
|
258
|
+
bottom: p(C),
|
|
259
|
+
left: p(it),
|
|
260
|
+
right: p(rt)
|
|
261
261
|
}, mt = {
|
|
262
|
-
top:
|
|
263
|
-
bottom:
|
|
264
|
-
left:
|
|
265
|
-
right:
|
|
266
|
-
},
|
|
267
|
-
top: o -
|
|
268
|
-
bottom: r +
|
|
269
|
-
left: i -
|
|
270
|
-
right: n +
|
|
262
|
+
top: p(at),
|
|
263
|
+
bottom: p(lt),
|
|
264
|
+
left: p(st),
|
|
265
|
+
right: p(ft)
|
|
266
|
+
}, F = {
|
|
267
|
+
top: o - E.top,
|
|
268
|
+
bottom: r + E.bottom,
|
|
269
|
+
left: i - E.left,
|
|
270
|
+
right: n + E.right
|
|
271
271
|
};
|
|
272
272
|
return {
|
|
273
|
-
margin:
|
|
273
|
+
margin: E,
|
|
274
274
|
padding: ct,
|
|
275
275
|
border: mt,
|
|
276
276
|
top: o,
|
|
@@ -279,12 +279,12 @@ function xt(e) {
|
|
|
279
279
|
right: n,
|
|
280
280
|
width: a,
|
|
281
281
|
height: s,
|
|
282
|
-
extremities:
|
|
283
|
-
floatingAlignment: Mt(
|
|
282
|
+
extremities: F,
|
|
283
|
+
floatingAlignment: Mt(F)
|
|
284
284
|
};
|
|
285
285
|
}
|
|
286
286
|
l(xt, "measureElement");
|
|
287
|
-
function
|
|
287
|
+
function Tt(e, { margin: t, width: o, height: i, top: n, left: r, bottom: a, right: s }) {
|
|
288
288
|
let f = i + t.bottom + t.top;
|
|
289
289
|
e.fillStyle = x.margin, e.fillRect(r, n - t.top, o, t.top), e.fillRect(s, n - t.top, t.right, f), e.fillRect(r, a, o, t.bottom), e.fillRect(
|
|
290
290
|
r - t.left, n - t.top, t.left, f);
|
|
@@ -312,21 +312,21 @@ function Dt(e, { margin: t, width: o, height: i, top: n, left: r, bottom: a, rig
|
|
|
312
312
|
];
|
|
313
313
|
return P(c);
|
|
314
314
|
}
|
|
315
|
-
l(
|
|
316
|
-
function
|
|
317
|
-
let c = i - o.left - o.right,
|
|
315
|
+
l(Tt, "drawMargin");
|
|
316
|
+
function Dt(e, { padding: t, border: o, width: i, height: n, top: r, left: a, bottom: s, right: f }) {
|
|
317
|
+
let c = i - o.left - o.right, u = n - t.top - t.bottom - o.top - o.bottom;
|
|
318
318
|
e.fillStyle = x.padding, e.fillRect(a + o.left, r + o.top, c, t.top), e.fillRect(
|
|
319
319
|
f - t.right - o.right,
|
|
320
320
|
r + t.top + o.top,
|
|
321
321
|
t.right,
|
|
322
|
-
|
|
322
|
+
u
|
|
323
323
|
), e.fillRect(
|
|
324
324
|
a + o.left,
|
|
325
325
|
s - t.bottom - o.bottom,
|
|
326
326
|
c,
|
|
327
327
|
t.bottom
|
|
328
|
-
), e.fillRect(a + o.left, r + t.top + o.top, t.left,
|
|
329
|
-
let
|
|
328
|
+
), e.fillRect(a + o.left, r + t.top + o.top, t.left, u);
|
|
329
|
+
let h = [
|
|
330
330
|
{
|
|
331
331
|
type: "padding",
|
|
332
332
|
text: t.top,
|
|
@@ -348,10 +348,10 @@ function kt(e, { padding: t, border: o, width: i, height: n, top: r, left: a, bo
|
|
|
348
348
|
position: "left"
|
|
349
349
|
}
|
|
350
350
|
];
|
|
351
|
-
return P(
|
|
351
|
+
return P(h);
|
|
352
352
|
}
|
|
353
|
-
l(
|
|
354
|
-
function
|
|
353
|
+
l(Dt, "drawPadding");
|
|
354
|
+
function kt(e, { border: t, width: o, height: i, top: n, left: r, bottom: a, right: s }) {
|
|
355
355
|
let f = i - t.top - t.bottom;
|
|
356
356
|
e.fillStyle = x.border, e.fillRect(r, n, o, t.top), e.fillRect(r, a - t.bottom, o, t.bottom), e.fillRect(r, n + t.top, t.left, f), e.fillRect(
|
|
357
357
|
s - t.right, n + t.top, t.right, f);
|
|
@@ -379,7 +379,7 @@ function Tt(e, { border: t, width: o, height: i, top: n, left: r, bottom: a, rig
|
|
|
379
379
|
];
|
|
380
380
|
return P(c);
|
|
381
381
|
}
|
|
382
|
-
l(
|
|
382
|
+
l(kt, "drawBorder");
|
|
383
383
|
function Pt(e, { padding: t, border: o, width: i, height: n, top: r, left: a }) {
|
|
384
384
|
let s = i - o.left - o.right - t.left - t.right, f = n - t.top - t.bottom - o.top - o.bottom;
|
|
385
385
|
return e.fillStyle = x.content, e.fillRect(
|
|
@@ -399,7 +399,7 @@ l(Pt, "drawContent");
|
|
|
399
399
|
function At(e) {
|
|
400
400
|
return (t) => {
|
|
401
401
|
if (e && t) {
|
|
402
|
-
let o = xt(e), i =
|
|
402
|
+
let o = xt(e), i = Tt(t, o), n = Dt(t, o), r = kt(t, o), a = Pt(t, o), s = o.width <= G * 3 || o.height <= G;
|
|
403
403
|
j(
|
|
404
404
|
t,
|
|
405
405
|
o,
|
|
@@ -410,15 +410,15 @@ function At(e) {
|
|
|
410
410
|
};
|
|
411
411
|
}
|
|
412
412
|
l(At, "drawBoxModel");
|
|
413
|
-
function
|
|
413
|
+
function U(e) {
|
|
414
414
|
$(At(e));
|
|
415
415
|
}
|
|
416
|
-
l(
|
|
416
|
+
l(U, "drawSelectedElement");
|
|
417
417
|
|
|
418
418
|
// src/measure/util.ts
|
|
419
|
-
var
|
|
420
|
-
var
|
|
421
|
-
let o =
|
|
419
|
+
var V = require("@storybook/global");
|
|
420
|
+
var K = /* @__PURE__ */ l((e, t) => {
|
|
421
|
+
let o = V.global.document.elementFromPoint(e, t), i = /* @__PURE__ */ l((r) => {
|
|
422
422
|
if (r && r.shadowRoot) {
|
|
423
423
|
let a = r.shadowRoot.elementFromPoint(e, t);
|
|
424
424
|
return r.isEqualNode(a) ? r : a.shadowRoot ? i(a) : a;
|
|
@@ -429,21 +429,23 @@ var U = /* @__PURE__ */ l((e, t) => {
|
|
|
429
429
|
}, "deepElementFromPoint");
|
|
430
430
|
|
|
431
431
|
// src/measure/withMeasure.ts
|
|
432
|
-
var Z,
|
|
432
|
+
var Z, T = { x: 0, y: 0 };
|
|
433
433
|
function Q(e, t) {
|
|
434
|
-
Z =
|
|
434
|
+
Z = K(e, t), U(Z);
|
|
435
435
|
}
|
|
436
436
|
l(Q, "findAndDrawElement");
|
|
437
437
|
var J = /* @__PURE__ */ l((e, t) => {
|
|
438
438
|
let { measureEnabled: o } = t.globals || {};
|
|
439
439
|
return (0, A.useEffect)(() => {
|
|
440
|
+
if (typeof globalThis.document > "u")
|
|
441
|
+
return;
|
|
440
442
|
let i = /* @__PURE__ */ l((n) => {
|
|
441
443
|
window.requestAnimationFrame(() => {
|
|
442
|
-
n.stopPropagation(),
|
|
444
|
+
n.stopPropagation(), T.x = n.clientX, T.y = n.clientY;
|
|
443
445
|
});
|
|
444
446
|
}, "onPointerMove");
|
|
445
|
-
return document.addEventListener("pointermove", i), () => {
|
|
446
|
-
document.removeEventListener("pointermove", i);
|
|
447
|
+
return globalThis.document.addEventListener("pointermove", i), () => {
|
|
448
|
+
globalThis.document.removeEventListener("pointermove", i);
|
|
447
449
|
};
|
|
448
450
|
}, []), (0, A.useEffect)(() => {
|
|
449
451
|
let i = /* @__PURE__ */ l((r) => {
|
|
@@ -455,15 +457,15 @@ var J = /* @__PURE__ */ l((e, t) => {
|
|
|
455
457
|
N();
|
|
456
458
|
});
|
|
457
459
|
}, "onResize");
|
|
458
|
-
return t.viewMode === "story" && o && (document.addEventListener("pointerover", i), z(), window.addEventListener("
|
|
459
|
-
|
|
460
|
-
window.removeEventListener("resize", n), O();
|
|
460
|
+
return t.viewMode === "story" && o && (globalThis.document.addEventListener("pointerover", i), z(), globalThis.window.addEventListener("\
|
|
461
|
+
resize", n), Q(T.x, T.y)), () => {
|
|
462
|
+
globalThis.window.removeEventListener("resize", n), O();
|
|
461
463
|
};
|
|
462
464
|
}, [o, t.viewMode]), e();
|
|
463
465
|
}, "withMeasure");
|
|
464
466
|
|
|
465
467
|
// src/measure/preview.ts
|
|
466
|
-
var et = [J], ot = {
|
|
468
|
+
var et = globalThis.FEATURES?.measure ? [J] : [], ot = {
|
|
467
469
|
[Y]: !1
|
|
468
470
|
}, Ht = /* @__PURE__ */ l(() => (0, tt.definePreview)({
|
|
469
471
|
decorators: et,
|
|
@@ -471,4 +473,4 @@ var et = [J], ot = {
|
|
|
471
473
|
}), "default");
|
|
472
474
|
|
|
473
475
|
// src/measure/index.ts
|
|
474
|
-
var
|
|
476
|
+
var Ft = /* @__PURE__ */ l(() => (0, nt.definePreview)(H), "default");
|