storybook 9.0.13 → 9.0.15
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 +43 -43
- package/dist/bin/index.js +43 -43
- package/dist/cli/bin/index.cjs +2 -2
- package/dist/cli/bin/index.js +2 -2
- package/dist/common/index.cjs +60 -60
- package/dist/common/index.js +106 -106
- package/dist/components/index.cjs +9 -7
- package/dist/components/index.d.ts +1 -0
- package/dist/components/index.js +9 -6
- package/dist/core-server/index.cjs +601 -601
- package/dist/core-server/index.js +2195 -2195
- package/dist/core-server/presets/common-manager.js +229 -228
- package/dist/instrumenter/index.cjs +1125 -1098
- package/dist/instrumenter/index.js +751 -729
- package/dist/manager/globals-runtime.js +20775 -23454
- package/dist/manager/runtime.js +1178 -1177
- package/dist/manager-api/index.cjs +1 -1
- package/dist/manager-api/index.js +1 -1
- package/dist/preview/runtime.js +13255 -15981
- package/dist/telemetry/index.cjs +2 -2
- package/dist/telemetry/index.js +2 -2
- package/dist/test/index.cjs +9136 -9815
- package/dist/test/index.js +8339 -9025
- package/package.json +4 -4
|
@@ -495,7 +495,7 @@ var Z, ct, Ne = V(() => {
|
|
|
495
495
|
});
|
|
496
496
|
|
|
497
497
|
// ../node_modules/color-name/index.js
|
|
498
|
-
var sc = K((
|
|
498
|
+
var sc = K((f5, ic) => {
|
|
499
499
|
"use strict";
|
|
500
500
|
ic.exports = {
|
|
501
501
|
aliceblue: [240, 248, 255],
|
|
@@ -650,7 +650,7 @@ var sc = K((d5, ic) => {
|
|
|
650
650
|
});
|
|
651
651
|
|
|
652
652
|
// ../node_modules/color-convert/conversions.js
|
|
653
|
-
var aa = K((
|
|
653
|
+
var aa = K((m5, cc) => {
|
|
654
654
|
var fr = sc(), lc = {};
|
|
655
655
|
for (let e of Object.keys(fr))
|
|
656
656
|
lc[fr[e]] = e;
|
|
@@ -985,7 +985,7 @@ var aa = K((f5, cc) => {
|
|
|
985
985
|
});
|
|
986
986
|
|
|
987
987
|
// ../node_modules/color-convert/route.js
|
|
988
|
-
var uc = K((
|
|
988
|
+
var uc = K((h5, pc) => {
|
|
989
989
|
var bo = aa();
|
|
990
990
|
function cb() {
|
|
991
991
|
let e = {}, t = Object.keys(bo);
|
|
@@ -1035,7 +1035,7 @@ var uc = K((g5, pc) => {
|
|
|
1035
1035
|
});
|
|
1036
1036
|
|
|
1037
1037
|
// ../node_modules/color-convert/index.js
|
|
1038
|
-
var fc = K((
|
|
1038
|
+
var fc = K((y5, dc) => {
|
|
1039
1039
|
var ia = aa(), fb = uc(), qt = {}, mb = Object.keys(ia);
|
|
1040
1040
|
function gb(e) {
|
|
1041
1041
|
let t = /* @__PURE__ */ a(function(...r) {
|
|
@@ -1695,7 +1695,7 @@ var Wc = K((qc, ya) => {
|
|
|
1695
1695
|
});
|
|
1696
1696
|
|
|
1697
1697
|
// ../node_modules/entities/lib/maps/entities.json
|
|
1698
|
-
var Ua = K((
|
|
1698
|
+
var Ua = K((UN, d1) => {
|
|
1699
1699
|
d1.exports = { Aacute: "\xC1", aacute: "\xE1", Abreve: "\u0102", abreve: "\u0103", ac: "\u223E", acd: "\u223F", acE: "\u223E\u0333", Acirc: "\
|
|
1700
1700
|
\xC2", acirc: "\xE2", acute: "\xB4", Acy: "\u0410", acy: "\u0430", AElig: "\xC6", aelig: "\xE6", af: "\u2061", Afr: "\u{1D504}", afr: "\u{1D51E}",
|
|
1701
1701
|
Agrave: "\xC0", agrave: "\xE0", alefsym: "\u2135", aleph: "\u2135", Alpha: "\u0391", alpha: "\u03B1", Amacr: "\u0100", amacr: "\u0101", amalg: "\
|
|
@@ -1977,7 +1977,7 @@ var Ua = K(($N, d1) => {
|
|
|
1977
1977
|
});
|
|
1978
1978
|
|
|
1979
1979
|
// ../node_modules/entities/lib/maps/legacy.json
|
|
1980
|
-
var Gp = K((
|
|
1980
|
+
var Gp = K((qN, f1) => {
|
|
1981
1981
|
f1.exports = { Aacute: "\xC1", aacute: "\xE1", Acirc: "\xC2", acirc: "\xE2", acute: "\xB4", AElig: "\xC6", aelig: "\xE6", Agrave: "\xC0", agrave: "\
|
|
1982
1982
|
\xE0", amp: "&", AMP: "&", Aring: "\xC5", aring: "\xE5", Atilde: "\xC3", atilde: "\xE3", Auml: "\xC4", auml: "\xE4", brvbar: "\xA6", Ccedil: "\
|
|
1983
1983
|
\xC7", ccedil: "\xE7", cedil: "\xB8", cent: "\xA2", copy: "\xA9", COPY: "\xA9", curren: "\xA4", deg: "\xB0", divide: "\xF7", Eacute: "\xC9",
|
|
@@ -1992,12 +1992,12 @@ var Gp = K((UN, f1) => {
|
|
|
1992
1992
|
});
|
|
1993
1993
|
|
|
1994
1994
|
// ../node_modules/entities/lib/maps/xml.json
|
|
1995
|
-
var qa = K((
|
|
1995
|
+
var qa = K((WN, m1) => {
|
|
1996
1996
|
m1.exports = { amp: "&", apos: "'", gt: ">", lt: "<", quot: '"' };
|
|
1997
1997
|
});
|
|
1998
1998
|
|
|
1999
1999
|
// ../node_modules/entities/lib/maps/decode.json
|
|
2000
|
-
var Jp = K((
|
|
2000
|
+
var Jp = K((GN, g1) => {
|
|
2001
2001
|
g1.exports = { "0": 65533, "128": 8364, "130": 8218, "131": 402, "132": 8222, "133": 8230, "134": 8224, "135": 8225, "136": 710, "137": 8240,
|
|
2002
2002
|
"138": 352, "139": 8249, "140": 338, "142": 381, "145": 8216, "146": 8217, "147": 8220, "148": 8221, "149": 8226, "150": 8211, "151": 8212,
|
|
2003
2003
|
"152": 732, "153": 8482, "154": 353, "155": 8250, "156": 339, "158": 382, "159": 376 };
|
|
@@ -2224,7 +2224,7 @@ var pu = K((j) => {
|
|
|
2224
2224
|
});
|
|
2225
2225
|
|
|
2226
2226
|
// ../node_modules/ansi-to-html/lib/ansi_to_html.js
|
|
2227
|
-
var Eu = K((
|
|
2227
|
+
var Eu = K((r_, vu) => {
|
|
2228
2228
|
"use strict";
|
|
2229
2229
|
function N1(e, t) {
|
|
2230
2230
|
if (!(e instanceof t))
|
|
@@ -2626,7 +2626,7 @@ e" : e === 9 ? t = "strike" : 29 < e && e < 38 || e === 39 || 89 < e && e < 98 ?
|
|
|
2626
2626
|
});
|
|
2627
2627
|
|
|
2628
2628
|
// ../node_modules/@devtools-ds/object-inspector/node_modules/@babel/runtime/helpers/extends.js
|
|
2629
|
-
var Uo = K((
|
|
2629
|
+
var Uo = K((k_, ti) => {
|
|
2630
2630
|
function ei() {
|
|
2631
2631
|
return ti.exports = ei = Object.assign || function(e) {
|
|
2632
2632
|
for (var t = 1; t < arguments.length; t++) {
|
|
@@ -2642,7 +2642,7 @@ var Uo = K((A_, ti) => {
|
|
|
2642
2642
|
});
|
|
2643
2643
|
|
|
2644
2644
|
// ../node_modules/@devtools-ds/object-inspector/node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js
|
|
2645
|
-
var Ou = K((
|
|
2645
|
+
var Ou = K((I_, ku) => {
|
|
2646
2646
|
function iv(e, t) {
|
|
2647
2647
|
if (e == null) return {};
|
|
2648
2648
|
var r = {}, o = Object.keys(e), n, i;
|
|
@@ -2655,7 +2655,7 @@ var Ou = K((O_, ku) => {
|
|
|
2655
2655
|
});
|
|
2656
2656
|
|
|
2657
2657
|
// ../node_modules/@devtools-ds/object-inspector/node_modules/@babel/runtime/helpers/objectWithoutProperties.js
|
|
2658
|
-
var qo = K((
|
|
2658
|
+
var qo = K((L_, Iu) => {
|
|
2659
2659
|
var sv = Ou();
|
|
2660
2660
|
function lv(e, t) {
|
|
2661
2661
|
if (e == null) return {};
|
|
@@ -2672,7 +2672,7 @@ var qo = K((P_, Iu) => {
|
|
|
2672
2672
|
});
|
|
2673
2673
|
|
|
2674
2674
|
// ../node_modules/@devtools-ds/themes/node_modules/@babel/runtime/helpers/defineProperty.js
|
|
2675
|
-
var Nu = K((
|
|
2675
|
+
var Nu = K((F_, Lu) => {
|
|
2676
2676
|
function pv(e, t, r) {
|
|
2677
2677
|
return t in e ? Object.defineProperty(e, t, {
|
|
2678
2678
|
value: r,
|
|
@@ -2686,7 +2686,7 @@ var Nu = K((M_, Lu) => {
|
|
|
2686
2686
|
});
|
|
2687
2687
|
|
|
2688
2688
|
// ../node_modules/@devtools-ds/themes/node_modules/@babel/runtime/helpers/objectSpread2.js
|
|
2689
|
-
var Bu = K((
|
|
2689
|
+
var Bu = K((R_, Du) => {
|
|
2690
2690
|
var uv = Nu();
|
|
2691
2691
|
function _u(e, t) {
|
|
2692
2692
|
var r = Object.keys(e);
|
|
@@ -2715,7 +2715,7 @@ var Bu = K((j_, Du) => {
|
|
|
2715
2715
|
});
|
|
2716
2716
|
|
|
2717
2717
|
// ../node_modules/@devtools-ds/themes/node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js
|
|
2718
|
-
var Fu = K((
|
|
2718
|
+
var Fu = K((V_, Mu) => {
|
|
2719
2719
|
function fv(e, t) {
|
|
2720
2720
|
if (e == null) return {};
|
|
2721
2721
|
var r = {}, o = Object.keys(e), n, i;
|
|
@@ -2728,7 +2728,7 @@ var Fu = K((H_, Mu) => {
|
|
|
2728
2728
|
});
|
|
2729
2729
|
|
|
2730
2730
|
// ../node_modules/@devtools-ds/themes/node_modules/@babel/runtime/helpers/objectWithoutProperties.js
|
|
2731
|
-
var Ru = K((
|
|
2731
|
+
var Ru = K(($_, ju) => {
|
|
2732
2732
|
var mv = Fu();
|
|
2733
2733
|
function gv(e, t) {
|
|
2734
2734
|
if (e == null) return {};
|
|
@@ -2745,7 +2745,7 @@ var Ru = K((z_, ju) => {
|
|
|
2745
2745
|
});
|
|
2746
2746
|
|
|
2747
2747
|
// ../node_modules/@devtools-ds/object-inspector/node_modules/@babel/runtime/helpers/defineProperty.js
|
|
2748
|
-
var $u = K((
|
|
2748
|
+
var $u = K((K_, zu) => {
|
|
2749
2749
|
function bv(e, t, r) {
|
|
2750
2750
|
return t in e ? Object.defineProperty(e, t, {
|
|
2751
2751
|
value: r,
|
|
@@ -2759,7 +2759,7 @@ var $u = K((J_, zu) => {
|
|
|
2759
2759
|
});
|
|
2760
2760
|
|
|
2761
2761
|
// ../node_modules/@devtools-ds/object-inspector/node_modules/@babel/runtime/helpers/objectSpread2.js
|
|
2762
|
-
var Wu = K((
|
|
2762
|
+
var Wu = K((X_, qu) => {
|
|
2763
2763
|
var yv = $u();
|
|
2764
2764
|
function Uu(e, t) {
|
|
2765
2765
|
var r = Object.keys(e);
|
|
@@ -2788,7 +2788,7 @@ var Wu = K((Y_, qu) => {
|
|
|
2788
2788
|
});
|
|
2789
2789
|
|
|
2790
2790
|
// ../node_modules/@devtools-ds/tree/node_modules/@babel/runtime/helpers/extends.js
|
|
2791
|
-
var Gu = K((
|
|
2791
|
+
var Gu = K((Q_, ci) => {
|
|
2792
2792
|
function li() {
|
|
2793
2793
|
return ci.exports = li = Object.assign || function(e) {
|
|
2794
2794
|
for (var t = 1; t < arguments.length; t++) {
|
|
@@ -2804,7 +2804,7 @@ var Gu = K((Z_, ci) => {
|
|
|
2804
2804
|
});
|
|
2805
2805
|
|
|
2806
2806
|
// ../node_modules/@devtools-ds/tree/node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js
|
|
2807
|
-
var Ku = K((
|
|
2807
|
+
var Ku = K((tD, Ju) => {
|
|
2808
2808
|
function vv(e, t) {
|
|
2809
2809
|
if (e == null) return {};
|
|
2810
2810
|
var r = {}, o = Object.keys(e), n, i;
|
|
@@ -2817,7 +2817,7 @@ var Ku = K((eD, Ju) => {
|
|
|
2817
2817
|
});
|
|
2818
2818
|
|
|
2819
2819
|
// ../node_modules/@devtools-ds/tree/node_modules/@babel/runtime/helpers/objectWithoutProperties.js
|
|
2820
|
-
var Xu = K((
|
|
2820
|
+
var Xu = K((oD, Yu) => {
|
|
2821
2821
|
var Ev = Ku();
|
|
2822
2822
|
function Sv(e, t) {
|
|
2823
2823
|
if (e == null) return {};
|
|
@@ -2834,8 +2834,8 @@ var Xu = K((rD, Yu) => {
|
|
|
2834
2834
|
});
|
|
2835
2835
|
|
|
2836
2836
|
// src/core-server/presets/common-manager.ts
|
|
2837
|
-
import { global as
|
|
2838
|
-
import { addons as
|
|
2837
|
+
import { global as OC } from "@storybook/global";
|
|
2838
|
+
import { addons as IC } from "storybook/manager-api";
|
|
2839
2839
|
|
|
2840
2840
|
// src/controls/manager.tsx
|
|
2841
2841
|
import Be from "react";
|
|
@@ -3307,8 +3307,8 @@ var bf = /* @__PURE__ */ a(function(t) {
|
|
|
3307
3307
|
throw new we(72, o, t);
|
|
3308
3308
|
return "" + n / i + t;
|
|
3309
3309
|
};
|
|
3310
|
-
}, "pxtoFactory"), Vs = bf,
|
|
3311
|
-
var
|
|
3310
|
+
}, "pxtoFactory"), Vs = bf, qT = Vs("em");
|
|
3311
|
+
var WT = Vs("rem");
|
|
3312
3312
|
function vn(e) {
|
|
3313
3313
|
return Math.round(e * 255);
|
|
3314
3314
|
}
|
|
@@ -3700,7 +3700,7 @@ function Mf(e, t) {
|
|
|
3700
3700
|
}));
|
|
3701
3701
|
}
|
|
3702
3702
|
a(Mf, "adjustHue");
|
|
3703
|
-
var
|
|
3703
|
+
var GT = Oe(Mf);
|
|
3704
3704
|
function Rt(e, t, r) {
|
|
3705
3705
|
return Math.max(e, Math.min(t, r));
|
|
3706
3706
|
}
|
|
@@ -3722,7 +3722,7 @@ function Rf(e, t) {
|
|
|
3722
3722
|
}));
|
|
3723
3723
|
}
|
|
3724
3724
|
a(Rf, "desaturate");
|
|
3725
|
-
var
|
|
3725
|
+
var JT = Oe(Rf);
|
|
3726
3726
|
function Hf(e, t) {
|
|
3727
3727
|
if (t === "transparent") return t;
|
|
3728
3728
|
var r = nt(t);
|
|
@@ -3767,38 +3767,38 @@ function Wf(e, t) {
|
|
|
3767
3767
|
}));
|
|
3768
3768
|
}
|
|
3769
3769
|
a(Wf, "saturate");
|
|
3770
|
-
var
|
|
3770
|
+
var KT = Oe(Wf);
|
|
3771
3771
|
function Gf(e, t) {
|
|
3772
3772
|
return t === "transparent" ? t : at(he({}, nt(t), {
|
|
3773
3773
|
hue: parseFloat(e)
|
|
3774
3774
|
}));
|
|
3775
3775
|
}
|
|
3776
3776
|
a(Gf, "setHue");
|
|
3777
|
-
var
|
|
3777
|
+
var YT = Oe(Gf);
|
|
3778
3778
|
function Jf(e, t) {
|
|
3779
3779
|
return t === "transparent" ? t : at(he({}, nt(t), {
|
|
3780
3780
|
lightness: parseFloat(e)
|
|
3781
3781
|
}));
|
|
3782
3782
|
}
|
|
3783
3783
|
a(Jf, "setLightness");
|
|
3784
|
-
var
|
|
3784
|
+
var XT = Oe(Jf);
|
|
3785
3785
|
function Kf(e, t) {
|
|
3786
3786
|
return t === "transparent" ? t : at(he({}, nt(t), {
|
|
3787
3787
|
saturation: parseFloat(e)
|
|
3788
3788
|
}));
|
|
3789
3789
|
}
|
|
3790
3790
|
a(Kf, "setSaturation");
|
|
3791
|
-
var
|
|
3791
|
+
var ZT = Oe(Kf);
|
|
3792
3792
|
function Yf(e, t) {
|
|
3793
3793
|
return t === "transparent" ? t : $s(parseFloat(e), "rgb(0, 0, 0)", t);
|
|
3794
3794
|
}
|
|
3795
3795
|
a(Yf, "shade");
|
|
3796
|
-
var
|
|
3796
|
+
var QT = Oe(Yf);
|
|
3797
3797
|
function Xf(e, t) {
|
|
3798
3798
|
return t === "transparent" ? t : $s(parseFloat(e), "rgb(255, 255, 255)", t);
|
|
3799
3799
|
}
|
|
3800
3800
|
a(Xf, "tint");
|
|
3801
|
-
var
|
|
3801
|
+
var eA = Oe(Xf);
|
|
3802
3802
|
function Zf(e, t) {
|
|
3803
3803
|
if (t === "transparent") return t;
|
|
3804
3804
|
var r = jt(t), o = typeof r.alpha == "number" ? r.alpha : 1, n = he({}, r, {
|
|
@@ -3917,10 +3917,10 @@ Yr, { style: { width: "80%" } })), "SourceSkeleton"), qs = /* @__PURE__ */ a(({
|
|
|
3917
3917
|
}, "Source");
|
|
3918
3918
|
|
|
3919
3919
|
// ../addons/docs/src/blocks/components/DocsPage.tsx
|
|
3920
|
-
import
|
|
3920
|
+
import hA from "react";
|
|
3921
3921
|
import { withReset as Ws } from "storybook/internal/components";
|
|
3922
3922
|
import { styled as Xr } from "storybook/theming";
|
|
3923
|
-
var te = /* @__PURE__ */ a((e) => `& :where(${e}:not(.sb-anchor, .sb-unstyled, .sb-unstyled ${e}))`, "toGlobalSelector"), An = 600,
|
|
3923
|
+
var te = /* @__PURE__ */ a((e) => `& :where(${e}:not(.sb-anchor, .sb-unstyled, .sb-unstyled ${e}))`, "toGlobalSelector"), An = 600, vA = Xr.
|
|
3924
3924
|
h1(Ws, ({ theme: e }) => ({
|
|
3925
3925
|
color: e.color.defaultText,
|
|
3926
3926
|
fontSize: e.typography.size.m3,
|
|
@@ -3931,7 +3931,7 @@ h1(Ws, ({ theme: e }) => ({
|
|
|
3931
3931
|
lineHeight: "36px",
|
|
3932
3932
|
marginBottom: "16px"
|
|
3933
3933
|
}
|
|
3934
|
-
})),
|
|
3934
|
+
})), EA = Xr.h2(Ws, ({ theme: e }) => ({
|
|
3935
3935
|
fontWeight: e.typography.weight.regular,
|
|
3936
3936
|
fontSize: e.typography.size.s3,
|
|
3937
3937
|
lineHeight: "20px",
|
|
@@ -3943,7 +3943,7 @@ h1(Ws, ({ theme: e }) => ({
|
|
|
3943
3943
|
marginBottom: 24
|
|
3944
3944
|
},
|
|
3945
3945
|
color: F(0.25, e.color.defaultText)
|
|
3946
|
-
})),
|
|
3946
|
+
})), SA = Xr.div(({ theme: e }) => {
|
|
3947
3947
|
let t = {
|
|
3948
3948
|
fontFamily: e.typography.fonts.base,
|
|
3949
3949
|
fontSize: e.typography.size.s3,
|
|
@@ -4289,7 +4289,7 @@ h1(Ws, ({ theme: e }) => ({
|
|
|
4289
4289
|
listStyle: "disc"
|
|
4290
4290
|
}
|
|
4291
4291
|
};
|
|
4292
|
-
}),
|
|
4292
|
+
}), CA = Xr.div(({ theme: e }) => ({
|
|
4293
4293
|
background: e.background.content,
|
|
4294
4294
|
display: "flex",
|
|
4295
4295
|
flexDirection: "row-reverse",
|
|
@@ -4315,13 +4315,13 @@ var it = /* @__PURE__ */ a((e) => ({
|
|
|
4315
4315
|
}), "getBlockBackgroundStyle");
|
|
4316
4316
|
|
|
4317
4317
|
// ../addons/docs/src/blocks/components/Story.tsx
|
|
4318
|
-
import
|
|
4319
|
-
import { ErrorFormatter as
|
|
4318
|
+
import jA, { useEffect as RA, useRef as HA, useState as VA } from "react";
|
|
4319
|
+
import { ErrorFormatter as $A, Loader as UA, getStoryHref as qA } from "storybook/internal/components";
|
|
4320
4320
|
import { styled as fm } from "storybook/theming";
|
|
4321
4321
|
|
|
4322
4322
|
// ../addons/docs/src/blocks/components/IFrame.tsx
|
|
4323
|
-
import
|
|
4324
|
-
var { window:
|
|
4323
|
+
import IA, { Component as PA } from "react";
|
|
4324
|
+
var { window: LA } = globalThis;
|
|
4325
4325
|
|
|
4326
4326
|
// ../addons/docs/src/blocks/components/ZoomContext.tsx
|
|
4327
4327
|
import { createContext as dm } from "react";
|
|
@@ -4330,8 +4330,8 @@ var kn = dm({
|
|
|
4330
4330
|
});
|
|
4331
4331
|
|
|
4332
4332
|
// ../addons/docs/src/blocks/components/Story.tsx
|
|
4333
|
-
var { PREVIEW_URL:
|
|
4334
|
-
var
|
|
4333
|
+
var { PREVIEW_URL: KA } = globalThis;
|
|
4334
|
+
var YA = fm.strong(({ theme: e }) => ({
|
|
4335
4335
|
color: e.color.orange
|
|
4336
4336
|
}));
|
|
4337
4337
|
|
|
@@ -4575,7 +4575,7 @@ var Im = Ht(Gs)({
|
|
|
4575
4575
|
), /* @__PURE__ */ je.createElement(Cm, { actionItems: E }))),
|
|
4576
4576
|
n && p && f
|
|
4577
4577
|
);
|
|
4578
|
-
}, "Preview"),
|
|
4578
|
+
}, "Preview"), gk = Ht(Lm)(() => ({
|
|
4579
4579
|
".docs-story": {
|
|
4580
4580
|
paddingTop: 32,
|
|
4581
4581
|
paddingBottom: 40
|
|
@@ -4583,46 +4583,46 @@ var Im = Ht(Gs)({
|
|
|
4583
4583
|
}));
|
|
4584
4584
|
|
|
4585
4585
|
// ../addons/docs/src/blocks/components/ArgsTable/TabbedArgsTable.tsx
|
|
4586
|
-
import
|
|
4587
|
-
import { TabsState as
|
|
4586
|
+
import xk from "react";
|
|
4587
|
+
import { TabsState as Ek } from "storybook/internal/components";
|
|
4588
4588
|
|
|
4589
4589
|
// ../addons/docs/src/blocks/components/Typeset.tsx
|
|
4590
|
-
import
|
|
4590
|
+
import Pk from "react";
|
|
4591
4591
|
import { withReset as Nm } from "storybook/internal/components";
|
|
4592
4592
|
import { styled as Zr } from "storybook/theming";
|
|
4593
|
-
var
|
|
4593
|
+
var Bk = Zr.div(({ theme: e }) => ({
|
|
4594
4594
|
marginRight: 30,
|
|
4595
4595
|
fontSize: `${e.typography.size.s1}px`,
|
|
4596
4596
|
color: e.base === "light" ? F(0.4, e.color.defaultText) : F(0.6, e.color.defaultText)
|
|
4597
|
-
})),
|
|
4597
|
+
})), Mk = Zr.div({
|
|
4598
4598
|
overflow: "hidden",
|
|
4599
4599
|
whiteSpace: "nowrap",
|
|
4600
4600
|
textOverflow: "ellipsis"
|
|
4601
|
-
}),
|
|
4601
|
+
}), Fk = Zr.div({
|
|
4602
4602
|
display: "flex",
|
|
4603
4603
|
flexDirection: "row",
|
|
4604
4604
|
alignItems: "baseline",
|
|
4605
4605
|
"&:not(:last-child)": { marginBottom: "1rem" }
|
|
4606
|
-
}),
|
|
4606
|
+
}), jk = Zr.div(Nm, ({ theme: e }) => ({
|
|
4607
4607
|
...it(e),
|
|
4608
4608
|
margin: "25px 0 40px",
|
|
4609
4609
|
padding: "30px 20px"
|
|
4610
4610
|
}));
|
|
4611
4611
|
|
|
4612
4612
|
// ../addons/docs/src/blocks/components/ColorPalette.tsx
|
|
4613
|
-
import
|
|
4614
|
-
import { ResetWrapper as
|
|
4613
|
+
import zk from "react";
|
|
4614
|
+
import { ResetWrapper as Uk } from "storybook/internal/components";
|
|
4615
4615
|
import { styled as Te } from "storybook/theming";
|
|
4616
|
-
var
|
|
4616
|
+
var Jk = Te.div(({ theme: e }) => ({
|
|
4617
4617
|
fontWeight: e.typography.weight.bold,
|
|
4618
4618
|
color: e.color.defaultText
|
|
4619
|
-
})),
|
|
4619
|
+
})), Kk = Te.div(({ theme: e }) => ({
|
|
4620
4620
|
color: e.base === "light" ? F(0.2, e.color.defaultText) : F(0.6, e.color.defaultText)
|
|
4621
|
-
})),
|
|
4621
|
+
})), Yk = Te.div({
|
|
4622
4622
|
flex: "0 0 30%",
|
|
4623
4623
|
lineHeight: "20px",
|
|
4624
4624
|
marginTop: 5
|
|
4625
|
-
}),
|
|
4625
|
+
}), Xk = Te.div(({ theme: e }) => ({
|
|
4626
4626
|
flex: 1,
|
|
4627
4627
|
textAlign: "center",
|
|
4628
4628
|
fontFamily: e.typography.fonts.mono,
|
|
@@ -4640,10 +4640,10 @@ var Gk = Te.div(({ theme: e }) => ({
|
|
|
4640
4640
|
display: "block",
|
|
4641
4641
|
marginTop: 2
|
|
4642
4642
|
}
|
|
4643
|
-
})),
|
|
4643
|
+
})), Zk = Te.div({
|
|
4644
4644
|
display: "flex",
|
|
4645
4645
|
flexDirection: "row"
|
|
4646
|
-
}),
|
|
4646
|
+
}), Qk = Te.div(({ background: e }) => ({
|
|
4647
4647
|
position: "relative",
|
|
4648
4648
|
flex: 1,
|
|
4649
4649
|
"&::before": {
|
|
@@ -4655,7 +4655,7 @@ var Gk = Te.div(({ theme: e }) => ({
|
|
|
4655
4655
|
background: e,
|
|
4656
4656
|
content: '""'
|
|
4657
4657
|
}
|
|
4658
|
-
})),
|
|
4658
|
+
})), e2 = Te.div(({ theme: e }) => ({
|
|
4659
4659
|
...it(e),
|
|
4660
4660
|
display: "flex",
|
|
4661
4661
|
flexDirection: "row",
|
|
@@ -4665,31 +4665,31 @@ var Gk = Te.div(({ theme: e }) => ({
|
|
|
4665
4665
|
backgroundColor: "white",
|
|
4666
4666
|
backgroundImage: "repeating-linear-gradient(-45deg, #ccc, #ccc 1px, #fff 1px, #fff 16px)",
|
|
4667
4667
|
backgroundClip: "padding-box"
|
|
4668
|
-
})),
|
|
4668
|
+
})), t2 = Te.div({
|
|
4669
4669
|
display: "flex",
|
|
4670
4670
|
flexDirection: "column",
|
|
4671
4671
|
flex: 1,
|
|
4672
4672
|
position: "relative",
|
|
4673
4673
|
marginBottom: 30
|
|
4674
|
-
}),
|
|
4674
|
+
}), r2 = Te.div({
|
|
4675
4675
|
flex: 1,
|
|
4676
4676
|
display: "flex",
|
|
4677
4677
|
flexDirection: "row"
|
|
4678
|
-
}),
|
|
4678
|
+
}), o2 = Te.div({
|
|
4679
4679
|
display: "flex",
|
|
4680
4680
|
alignItems: "flex-start"
|
|
4681
|
-
}), o2 = Te.div({
|
|
4682
|
-
flex: "0 0 30%"
|
|
4683
4681
|
}), n2 = Te.div({
|
|
4682
|
+
flex: "0 0 30%"
|
|
4683
|
+
}), a2 = Te.div({
|
|
4684
4684
|
flex: 1
|
|
4685
|
-
}),
|
|
4685
|
+
}), i2 = Te.div(({ theme: e }) => ({
|
|
4686
4686
|
display: "flex",
|
|
4687
4687
|
flexDirection: "row",
|
|
4688
4688
|
alignItems: "center",
|
|
4689
4689
|
paddingBottom: 20,
|
|
4690
4690
|
fontWeight: e.typography.weight.bold,
|
|
4691
4691
|
color: e.base === "light" ? F(0.4, e.color.defaultText) : F(0.6, e.color.defaultText)
|
|
4692
|
-
})),
|
|
4692
|
+
})), s2 = Te.div(({ theme: e }) => ({
|
|
4693
4693
|
fontSize: e.typography.size.s2,
|
|
4694
4694
|
lineHeight: "20px",
|
|
4695
4695
|
display: "flex",
|
|
@@ -4697,10 +4697,10 @@ var Gk = Te.div(({ theme: e }) => ({
|
|
|
4697
4697
|
}));
|
|
4698
4698
|
|
|
4699
4699
|
// ../addons/docs/src/blocks/components/IconGallery.tsx
|
|
4700
|
-
import
|
|
4701
|
-
import { ResetWrapper as
|
|
4700
|
+
import u2 from "react";
|
|
4701
|
+
import { ResetWrapper as f2 } from "storybook/internal/components";
|
|
4702
4702
|
import { styled as Qr } from "storybook/theming";
|
|
4703
|
-
var
|
|
4703
|
+
var h2 = Qr.div(({ theme: e }) => ({
|
|
4704
4704
|
fontFamily: e.typography.fonts.base,
|
|
4705
4705
|
fontSize: e.typography.size.s1,
|
|
4706
4706
|
color: e.color.defaultText,
|
|
@@ -4712,7 +4712,7 @@ var g2 = Qr.div(({ theme: e }) => ({
|
|
|
4712
4712
|
textOverflow: "ellipsis",
|
|
4713
4713
|
WebkitLineClamp: 2,
|
|
4714
4714
|
WebkitBoxOrient: "vertical"
|
|
4715
|
-
})),
|
|
4715
|
+
})), b2 = Qr.div(({ theme: e }) => ({
|
|
4716
4716
|
...it(e),
|
|
4717
4717
|
overflow: "hidden",
|
|
4718
4718
|
height: 40,
|
|
@@ -4725,12 +4725,12 @@ var g2 = Qr.div(({ theme: e }) => ({
|
|
|
4725
4725
|
width: 20,
|
|
4726
4726
|
height: 20
|
|
4727
4727
|
}
|
|
4728
|
-
})),
|
|
4728
|
+
})), y2 = Qr.div({
|
|
4729
4729
|
display: "inline-flex",
|
|
4730
4730
|
flexDirection: "row",
|
|
4731
4731
|
alignItems: "center",
|
|
4732
4732
|
width: "100%"
|
|
4733
|
-
}),
|
|
4733
|
+
}), x2 = Qr.div({
|
|
4734
4734
|
display: "grid",
|
|
4735
4735
|
gridTemplateColumns: "repeat(auto-fill, minmax(140px, 1fr))",
|
|
4736
4736
|
gridGap: "8px 16px",
|
|
@@ -4739,15 +4739,15 @@ var g2 = Qr.div(({ theme: e }) => ({
|
|
|
4739
4739
|
});
|
|
4740
4740
|
|
|
4741
4741
|
// ../addons/docs/src/blocks/components/TableOfContents.tsx
|
|
4742
|
-
import
|
|
4743
|
-
import { NAVIGATE_URL as
|
|
4742
|
+
import X2, { useEffect as Z2, useId as Q2 } from "react";
|
|
4743
|
+
import { NAVIGATE_URL as tO } from "storybook/internal/core-events";
|
|
4744
4744
|
import { styled as Nn } from "storybook/theming";
|
|
4745
|
-
var
|
|
4745
|
+
var nO = Nn.aside(() => ({
|
|
4746
4746
|
width: "10rem",
|
|
4747
4747
|
"@media (max-width: 768px)": {
|
|
4748
4748
|
display: "none"
|
|
4749
4749
|
}
|
|
4750
|
-
})),
|
|
4750
|
+
})), aO = Nn.nav(({ theme: e }) => ({
|
|
4751
4751
|
position: "fixed",
|
|
4752
4752
|
bottom: 0,
|
|
4753
4753
|
top: 0,
|
|
@@ -4806,7 +4806,7 @@ var oO = Nn.aside(() => ({
|
|
|
4806
4806
|
color: e.color.secondary,
|
|
4807
4807
|
textDecoration: "none"
|
|
4808
4808
|
}
|
|
4809
|
-
})),
|
|
4809
|
+
})), iO = Nn.p(({ theme: e }) => ({
|
|
4810
4810
|
fontWeight: 600,
|
|
4811
4811
|
fontSize: "0.875em",
|
|
4812
4812
|
color: e.textColor,
|
|
@@ -9751,24 +9751,24 @@ var Vp = Hp.register(Lt, (e) => {
|
|
|
9751
9751
|
|
|
9752
9752
|
// src/component-testing/manager.tsx
|
|
9753
9753
|
import nn from "react";
|
|
9754
|
-
import { AddonPanel as
|
|
9755
|
-
import { Consumer as
|
|
9754
|
+
import { AddonPanel as AS } from "storybook/internal/components";
|
|
9755
|
+
import { Consumer as kS, addons as Id, types as OS } from "storybook/manager-api";
|
|
9756
9756
|
|
|
9757
9757
|
// src/component-testing/components/Panel.tsx
|
|
9758
|
-
import Td, { Fragment as
|
|
9758
|
+
import Td, { Fragment as uS, memo as dS, useEffect as Ei, useMemo as Ad, useRef as Si, useState as Ci } from "react";
|
|
9759
9759
|
import {
|
|
9760
|
-
FORCE_REMOUNT as
|
|
9761
|
-
PLAY_FUNCTION_THREW_EXCEPTION as
|
|
9762
|
-
STORY_RENDER_PHASE_CHANGED as
|
|
9763
|
-
STORY_THREW_EXCEPTION as
|
|
9764
|
-
UNHANDLED_ERRORS_WHILE_PLAYING as
|
|
9760
|
+
FORCE_REMOUNT as fS,
|
|
9761
|
+
PLAY_FUNCTION_THREW_EXCEPTION as mS,
|
|
9762
|
+
STORY_RENDER_PHASE_CHANGED as gS,
|
|
9763
|
+
STORY_THREW_EXCEPTION as hS,
|
|
9764
|
+
UNHANDLED_ERRORS_WHILE_PLAYING as bS
|
|
9765
9765
|
} from "storybook/internal/core-events";
|
|
9766
9766
|
import { global as wi } from "@storybook/global";
|
|
9767
9767
|
import {
|
|
9768
|
-
experimental_useStatusStore as
|
|
9769
|
-
useAddonState as
|
|
9770
|
-
useChannel as
|
|
9771
|
-
useParameter as
|
|
9768
|
+
experimental_useStatusStore as yS,
|
|
9769
|
+
useAddonState as xS,
|
|
9770
|
+
useChannel as vS,
|
|
9771
|
+
useParameter as ES
|
|
9772
9772
|
} from "storybook/manager-api";
|
|
9773
9773
|
|
|
9774
9774
|
// src/component-testing/constants.ts
|
|
@@ -9778,12 +9778,12 @@ rnal_render_call";
|
|
|
9778
9778
|
|
|
9779
9779
|
// ../addons/a11y/src/constants.ts
|
|
9780
9780
|
var gt = "storybook/a11y", l1 = `${gt}/panel`;
|
|
9781
|
-
var
|
|
9782
|
-
ting-tests/accessibility-testing",
|
|
9781
|
+
var PN = `${gt}/result`, LN = `${gt}/request`, NN = `${gt}/running`, _N = `${gt}/error`, DN = `${gt}/manual`, BN = `${gt}/select`, c1 = "wri\
|
|
9782
|
+
ting-tests/accessibility-testing", MN = `${c1}#why-are-my-tests-failing-in-different-environments`;
|
|
9783
9783
|
|
|
9784
9784
|
// ../addons/vitest/src/constants.ts
|
|
9785
|
-
var Up = "storybook/test",
|
|
9786
|
-
var p1 = "writing-tests/integrations/vitest-addon",
|
|
9785
|
+
var Up = "storybook/test", jN = `${Up}/test-provider`, qp = "STORYBOOK_ADDON_TEST_CHANNEL";
|
|
9786
|
+
var p1 = "writing-tests/integrations/vitest-addon", RN = `${p1}#what-happens-if-vitest-itself-has-an-error`;
|
|
9787
9787
|
var u1 = {
|
|
9788
9788
|
id: Up,
|
|
9789
9789
|
initialState: {
|
|
@@ -9820,7 +9820,7 @@ var u1 = {
|
|
|
9820
9820
|
}
|
|
9821
9821
|
}
|
|
9822
9822
|
};
|
|
9823
|
-
var
|
|
9823
|
+
var HN = `UNIVERSAL_STORE:${u1.id}`;
|
|
9824
9824
|
var Wp = "storybook/component-test";
|
|
9825
9825
|
|
|
9826
9826
|
// src/instrumenter/EVENTS.ts
|
|
@@ -11071,7 +11071,7 @@ import {
|
|
|
11071
11071
|
RewindIcon as JE,
|
|
11072
11072
|
SyncIcon as KE
|
|
11073
11073
|
} from "@storybook/icons";
|
|
11074
|
-
import { styled as Ve } from "storybook/theming";
|
|
11074
|
+
import { styled as Ve, useTheme as YE } from "storybook/theming";
|
|
11075
11075
|
|
|
11076
11076
|
// src/component-testing/components/StatusBadge.tsx
|
|
11077
11077
|
import DE from "react";
|
|
@@ -11104,19 +11104,19 @@ var ME = {
|
|
|
11104
11104
|
}, "StatusBadge");
|
|
11105
11105
|
|
|
11106
11106
|
// src/component-testing/components/Subnav.tsx
|
|
11107
|
-
var
|
|
11107
|
+
var XE = Ve.div(({ theme: e }) => ({
|
|
11108
11108
|
boxShadow: `${e.appBorderColor} 0 -1px 0 0 inset`,
|
|
11109
11109
|
background: e.background.app,
|
|
11110
11110
|
position: "sticky",
|
|
11111
11111
|
top: 0,
|
|
11112
11112
|
zIndex: 1
|
|
11113
|
-
})),
|
|
11113
|
+
})), ZE = Ve.nav({
|
|
11114
11114
|
height: 40,
|
|
11115
11115
|
display: "flex",
|
|
11116
11116
|
alignItems: "center",
|
|
11117
11117
|
justifyContent: "space-between",
|
|
11118
11118
|
paddingLeft: 15
|
|
11119
|
-
})
|
|
11119
|
+
}), QE = Ve(HE)(({ theme: e }) => ({
|
|
11120
11120
|
borderRadius: 4,
|
|
11121
11121
|
padding: 6,
|
|
11122
11122
|
color: e.textMutedColor,
|
|
@@ -11130,9 +11130,9 @@ var YE = Ve.div(({ theme: e }) => ({
|
|
|
11130
11130
|
})), Nr = Ve(VE)(({ theme: e }) => ({
|
|
11131
11131
|
color: e.textMutedColor,
|
|
11132
11132
|
margin: "0 3px"
|
|
11133
|
-
})),
|
|
11133
|
+
})), eS = Ve($E)({
|
|
11134
11134
|
marginTop: 0
|
|
11135
|
-
}),
|
|
11135
|
+
}), tS = Ve(zE)(({ theme: e }) => ({
|
|
11136
11136
|
color: e.textMutedColor,
|
|
11137
11137
|
justifyContent: "flex-end",
|
|
11138
11138
|
textAlign: "right",
|
|
@@ -11144,14 +11144,14 @@ var YE = Ve.div(({ theme: e }) => ({
|
|
|
11144
11144
|
})), hd = Ve.div({
|
|
11145
11145
|
display: "flex",
|
|
11146
11146
|
alignItems: "center"
|
|
11147
|
-
}),
|
|
11147
|
+
}), rS = Ve(Nr)({
|
|
11148
11148
|
marginLeft: 9
|
|
11149
|
-
}),
|
|
11149
|
+
}), oS = Ve(QE)({
|
|
11150
11150
|
marginLeft: 9,
|
|
11151
11151
|
marginRight: 9,
|
|
11152
11152
|
marginBottom: 1,
|
|
11153
11153
|
lineHeight: "12px"
|
|
11154
|
-
}),
|
|
11154
|
+
}), nS = Ve(Nr)(({ theme: e, animating: t, disabled: r }) => ({
|
|
11155
11155
|
opacity: r ? 0.5 : 1,
|
|
11156
11156
|
svg: {
|
|
11157
11157
|
animation: t ? `${e.animation.rotate360} 200ms ease-out` : void 0
|
|
@@ -11163,12 +11163,13 @@ var YE = Ve.div(({ theme: e }) => ({
|
|
|
11163
11163
|
storyFileName: o,
|
|
11164
11164
|
onScrollToEnd: n
|
|
11165
11165
|
}) => {
|
|
11166
|
-
let i = r === "error" ? "Scroll to error" : "Scroll to end";
|
|
11167
|
-
return /* @__PURE__ */ q.createElement(
|
|
11168
|
-
|
|
11169
|
-
createElement(
|
|
11170
|
-
hover", hasChrome: !1, tooltip: /* @__PURE__ */ q.createElement(Lr, { note: "Go to start" }) }, /* @__PURE__ */ q.
|
|
11171
|
-
|
|
11166
|
+
let i = r === "error" ? "Scroll to error" : "Scroll to end", s = YE();
|
|
11167
|
+
return /* @__PURE__ */ q.createElement(XE, null, /* @__PURE__ */ q.createElement(RE, { backgroundColor: s.background.app }, /* @__PURE__ */ q.
|
|
11168
|
+
createElement(ZE, { "aria-label": "Component tests toolbar" }, /* @__PURE__ */ q.createElement(hd, null, /* @__PURE__ */ q.createElement(gd,
|
|
11169
|
+
{ status: r }), /* @__PURE__ */ q.createElement(oS, { onClick: n, disabled: !n }, i), /* @__PURE__ */ q.createElement(eS, null), /* @__PURE__ */ q.
|
|
11170
|
+
createElement(Pr, { trigger: "hover", hasChrome: !1, tooltip: /* @__PURE__ */ q.createElement(Lr, { note: "Go to start" }) }, /* @__PURE__ */ q.
|
|
11171
|
+
createElement(
|
|
11172
|
+
rS,
|
|
11172
11173
|
{
|
|
11173
11174
|
"aria-label": "Go to start",
|
|
11174
11175
|
onClick: e.start,
|
|
@@ -11203,16 +11204,16 @@ d" }) }, /* @__PURE__ */ q.createElement(
|
|
|
11203
11204
|
},
|
|
11204
11205
|
/* @__PURE__ */ q.createElement(qE, null)
|
|
11205
11206
|
)), /* @__PURE__ */ q.createElement(Pr, { trigger: "hover", hasChrome: !1, tooltip: /* @__PURE__ */ q.createElement(Lr, { note: "Rerun" }) },
|
|
11206
|
-
/* @__PURE__ */ q.createElement(
|
|
11207
|
-
createElement(hd, null, /* @__PURE__ */ q.createElement(
|
|
11207
|
+
/* @__PURE__ */ q.createElement(nS, { "aria-label": "Rerun", onClick: e.rerun }, /* @__PURE__ */ q.createElement(KE, null)))), o && /* @__PURE__ */ q.
|
|
11208
|
+
createElement(hd, null, /* @__PURE__ */ q.createElement(tS, null, o)))));
|
|
11208
11209
|
}, "Subnav");
|
|
11209
11210
|
|
|
11210
11211
|
// src/component-testing/components/TestDiscrepancyMessage.tsx
|
|
11211
11212
|
import yd from "react";
|
|
11212
|
-
import { Link as
|
|
11213
|
-
import { useStorybookApi as
|
|
11214
|
-
import { styled as
|
|
11215
|
-
var
|
|
11213
|
+
import { Link as aS } from "storybook/internal/components";
|
|
11214
|
+
import { useStorybookApi as iS } from "storybook/manager-api";
|
|
11215
|
+
import { styled as sS } from "storybook/theming";
|
|
11216
|
+
var lS = sS.div(({ theme: { color: e, typography: t, background: r } }) => ({
|
|
11216
11217
|
textAlign: "start",
|
|
11217
11218
|
padding: "11px 15px",
|
|
11218
11219
|
fontSize: `${t.size.s2 - 1}px`,
|
|
@@ -11233,17 +11234,17 @@ var sS = iS.div(({ theme: { color: e, typography: t, background: r } }) => ({
|
|
|
11233
11234
|
boxShadow: "0 0 0 1px rgba(0, 0, 0, 0.1)"
|
|
11234
11235
|
}
|
|
11235
11236
|
})), xd = /* @__PURE__ */ a(({ browserTestStatus: e }) => {
|
|
11236
|
-
let r =
|
|
11237
|
+
let r = iS().getDocsUrl({
|
|
11237
11238
|
subpath: zp,
|
|
11238
11239
|
versioned: !0,
|
|
11239
11240
|
renderer: !0
|
|
11240
11241
|
}), [o, n] = e === "error" ? ["the CLI", "this browser"] : ["this browser", "the CLI"];
|
|
11241
|
-
return /* @__PURE__ */ yd.createElement(
|
|
11242
|
-
createElement(
|
|
11242
|
+
return /* @__PURE__ */ yd.createElement(lS, null, "This interaction test passed in ", o, ", but the tests failed in ", n, ".", " ", /* @__PURE__ */ yd.
|
|
11243
|
+
createElement(aS, { href: r, target: "_blank", withArrow: !0 }, "Learn what could cause this"));
|
|
11243
11244
|
}, "TestDiscrepancyMessage");
|
|
11244
11245
|
|
|
11245
11246
|
// src/component-testing/components/InteractionsPanel.tsx
|
|
11246
|
-
var
|
|
11247
|
+
var cS = er.div(({ theme: e }) => ({
|
|
11247
11248
|
height: "100%",
|
|
11248
11249
|
background: e.background.content
|
|
11249
11250
|
})), vd = er.div(({ theme: e }) => ({
|
|
@@ -11264,7 +11265,7 @@ var lS = er.div(({ theme: e }) => ({
|
|
|
11264
11265
|
})), Ed = er.div({
|
|
11265
11266
|
paddingBottom: 4,
|
|
11266
11267
|
fontWeight: "bold"
|
|
11267
|
-
}),
|
|
11268
|
+
}), pS = er.p({
|
|
11268
11269
|
margin: 0,
|
|
11269
11270
|
padding: "0 0 20px"
|
|
11270
11271
|
}), Sd = er.pre(({ theme: e }) => ({
|
|
@@ -11293,7 +11294,7 @@ var lS = er.div(({ theme: e }) => ({
|
|
|
11293
11294
|
browserTestStatus: h
|
|
11294
11295
|
}) {
|
|
11295
11296
|
let b = Qt(), y = i.some((x) => x.id !== ve);
|
|
11296
|
-
return /* @__PURE__ */ Q.createElement(
|
|
11297
|
+
return /* @__PURE__ */ Q.createElement(cS, null, f && /* @__PURE__ */ Q.createElement(xd, { browserTestStatus: h }), n.detached && (y ||
|
|
11297
11298
|
l) && /* @__PURE__ */ Q.createElement(Tu, { storyUrl: t }), (i.length > 0 || l) && /* @__PURE__ */ Q.createElement(
|
|
11298
11299
|
bd,
|
|
11299
11300
|
{
|
|
@@ -11327,7 +11328,7 @@ var lS = er.div(({ theme: e }) => ({
|
|
|
11327
11328
|
}
|
|
11328
11329
|
}
|
|
11329
11330
|
)), u && /* @__PURE__ */ Q.createElement(vd, null, /* @__PURE__ */ Q.createElement(Ed, null, "Unhandled Errors"), /* @__PURE__ */ Q.createElement(
|
|
11330
|
-
|
|
11331
|
+
pS, null, "Found ", u.length, " unhandled error", u.length > 1 ? "s" : "", " ", "while running the play function. This might cause false\
|
|
11331
11332
|
positive assertions. Resolve unhandled errors or ignore unhandled errors with setting the", /* @__PURE__ */ Q.createElement(vi, null, "test\
|
|
11332
11333
|
.dangerouslyIgnoreUnhandledErrors"), " ", "parameter to ", /* @__PURE__ */ Q.createElement(vi, null, "true"), "."), u.map((x, v) => /* @__PURE__ */ Q.createElement(
|
|
11333
11334
|
Sd, { key: v, "data-chromatic": "ignore" }, Cd(x)))), /* @__PURE__ */ Q.createElement("div", { ref: m }), !d && !c && !y && /* @__PURE__ */ Q.createElement(
|
|
@@ -11347,7 +11348,7 @@ var en = {
|
|
|
11347
11348
|
goto: !1,
|
|
11348
11349
|
next: !1,
|
|
11349
11350
|
end: !1
|
|
11350
|
-
},
|
|
11351
|
+
}, SS = {
|
|
11351
11352
|
done: "status-value:success",
|
|
11352
11353
|
error: "status-value:error",
|
|
11353
11354
|
active: "status-value:pending",
|
|
@@ -11389,15 +11390,15 @@ var en = {
|
|
|
11389
11390
|
callId: ve,
|
|
11390
11391
|
status: e,
|
|
11391
11392
|
ancestors: []
|
|
11392
|
-
}), "getInternalRenderLogItem"), kd =
|
|
11393
|
+
}), "getInternalRenderLogItem"), kd = dS(
|
|
11393
11394
|
/* @__PURE__ */ a(function({ refId: t, storyId: r, storyUrl: o }) {
|
|
11394
|
-
let { statusValue: n, testRunId: i } =
|
|
11395
|
+
let { statusValue: n, testRunId: i } = yS((B) => {
|
|
11395
11396
|
let R = t ? void 0 : B[r]?.[Wp];
|
|
11396
11397
|
return {
|
|
11397
11398
|
statusValue: R?.value,
|
|
11398
11399
|
testRunId: R?.data?.testRunId
|
|
11399
11400
|
};
|
|
11400
|
-
}), [s, l] =
|
|
11401
|
+
}), [s, l] = xS(Nt, {
|
|
11401
11402
|
controlStates: en,
|
|
11402
11403
|
isErrored: !1,
|
|
11403
11404
|
pausedAt: void 0,
|
|
@@ -11425,7 +11426,7 @@ var en = {
|
|
|
11425
11426
|
{ root: wi.document.querySelector("#panel-tab-content") }
|
|
11426
11427
|
), D.current && B.observe(D.current)), () => B?.disconnect();
|
|
11427
11428
|
}, []);
|
|
11428
|
-
let _ =
|
|
11429
|
+
let _ = vS(
|
|
11429
11430
|
{
|
|
11430
11431
|
[ht.CALL]: I,
|
|
11431
11432
|
[ht.SYNC]: (B) => {
|
|
@@ -11447,7 +11448,7 @@ var en = {
|
|
|
11447
11448
|
};
|
|
11448
11449
|
});
|
|
11449
11450
|
},
|
|
11450
|
-
[
|
|
11451
|
+
[gS]: (B) => {
|
|
11451
11452
|
if (B.newPhase === "preparing")
|
|
11452
11453
|
w.current = [rn("active")], E.current.set(ve, Ti(r)), l({
|
|
11453
11454
|
controlStates: en,
|
|
@@ -11480,7 +11481,7 @@ var en = {
|
|
|
11480
11481
|
);
|
|
11481
11482
|
}
|
|
11482
11483
|
},
|
|
11483
|
-
[
|
|
11484
|
+
[hS]: (B) => {
|
|
11484
11485
|
w.current = [rn("error")], E.current.set(
|
|
11485
11486
|
ve,
|
|
11486
11487
|
Ti(r, { ...B, callId: ve })
|
|
@@ -11504,10 +11505,10 @@ var en = {
|
|
|
11504
11505
|
})
|
|
11505
11506
|
);
|
|
11506
11507
|
},
|
|
11507
|
-
[
|
|
11508
|
+
[mS]: (B) => {
|
|
11508
11509
|
l((R) => ({ ...R, caughtException: B, hasException: !0 }));
|
|
11509
11510
|
},
|
|
11510
|
-
[
|
|
11511
|
+
[bS]: (B) => {
|
|
11511
11512
|
l((R) => ({ ...R, unhandledErrors: B, hasException: !0 }));
|
|
11512
11513
|
}
|
|
11513
11514
|
},
|
|
@@ -11534,15 +11535,15 @@ var en = {
|
|
|
11534
11535
|
next: /* @__PURE__ */ a(() => _(ht.NEXT, { storyId: r }), "next"),
|
|
11535
11536
|
end: /* @__PURE__ */ a(() => _(ht.END, { storyId: r }), "end"),
|
|
11536
11537
|
rerun: /* @__PURE__ */ a(() => {
|
|
11537
|
-
_(
|
|
11538
|
+
_(fS, { storyId: r });
|
|
11538
11539
|
}, "rerun")
|
|
11539
11540
|
}),
|
|
11540
11541
|
[_, r]
|
|
11541
|
-
), W =
|
|
11542
|
+
), W = ES("fileName", ""), [ee] = W.toString().split("/").slice(-1), ce = /* @__PURE__ */ a(() => c?.scrollIntoView({ behavior: "smooth",
|
|
11542
11543
|
block: "end" }), "scrollToTarget"), ne = !!v || !!S || // @ts-expect-error TODO
|
|
11543
11544
|
y.some((B) => B.status === "error"), ae = Ad(() => !x && (y.length > 0 || ne) ? ne ? "error" : "done" : x ? "active" : void 0, [x, y, ne]);
|
|
11544
11545
|
return Ei(() => {
|
|
11545
|
-
if (ae && n && n !== "status-value:pending" && n !==
|
|
11546
|
+
if (ae && n && n !== "status-value:pending" && n !== SS[ae]) {
|
|
11546
11547
|
let R = setTimeout(
|
|
11547
11548
|
() => m((T) => (T || _(qp, {
|
|
11548
11549
|
type: "test-discrepancy",
|
|
@@ -11558,7 +11559,7 @@ var en = {
|
|
|
11558
11559
|
return () => clearTimeout(R);
|
|
11559
11560
|
} else
|
|
11560
11561
|
m(!1);
|
|
11561
|
-
}, [_, ae, n, r, i]), /* @__PURE__ */ Td.createElement(
|
|
11562
|
+
}, [_, ae, n, r, i]), /* @__PURE__ */ Td.createElement(uS, { key: "component-tests" }, /* @__PURE__ */ Td.createElement(
|
|
11562
11563
|
wd,
|
|
11563
11564
|
{
|
|
11564
11565
|
storyUrl: o,
|
|
@@ -11584,12 +11585,12 @@ var en = {
|
|
|
11584
11585
|
|
|
11585
11586
|
// src/component-testing/components/PanelTitle.tsx
|
|
11586
11587
|
import on from "react";
|
|
11587
|
-
import { Badge as
|
|
11588
|
-
import { useAddonState as
|
|
11588
|
+
import { Badge as CS } from "storybook/internal/components";
|
|
11589
|
+
import { useAddonState as wS, useStorybookApi as TS } from "storybook/manager-api";
|
|
11589
11590
|
function Od() {
|
|
11590
|
-
let t =
|
|
11591
|
+
let t = TS().getSelectedPanel(), [r = {}] = wS(Nt), { isErrored: o, hasException: n, interactionsCount: i } = r;
|
|
11591
11592
|
return /* @__PURE__ */ on.createElement("div", { style: { display: "flex", alignItems: "center", gap: 6 } }, /* @__PURE__ */ on.createElement(
|
|
11592
|
-
"span", null, "Interactions"), i && !o && !n ? /* @__PURE__ */ on.createElement(
|
|
11593
|
+
"span", null, "Interactions"), i && !o && !n ? /* @__PURE__ */ on.createElement(CS, { compact: !0, status: t === Zt ? "active" : "neutral" },
|
|
11593
11594
|
i) : null, o || n ? /* @__PURE__ */ on.createElement(Zo, { status: "error" }) : null);
|
|
11594
11595
|
}
|
|
11595
11596
|
a(Od, "PanelTitle");
|
|
@@ -11607,28 +11608,28 @@ var Pd = Id.register(Nt, () => {
|
|
|
11607
11608
|
};
|
|
11608
11609
|
}, "filter");
|
|
11609
11610
|
Id.add(Zt, {
|
|
11610
|
-
type:
|
|
11611
|
+
type: OS.PANEL,
|
|
11611
11612
|
title: /* @__PURE__ */ a(() => /* @__PURE__ */ nn.createElement(Od, null), "title"),
|
|
11612
11613
|
match: /* @__PURE__ */ a(({ viewMode: t }) => t === "story", "match"),
|
|
11613
|
-
render: /* @__PURE__ */ a(({ active: t }) => /* @__PURE__ */ nn.createElement(
|
|
11614
|
+
render: /* @__PURE__ */ a(({ active: t }) => /* @__PURE__ */ nn.createElement(AS, { active: !!t }, /* @__PURE__ */ nn.createElement(kS,
|
|
11614
11615
|
{ filter: e }, (r) => /* @__PURE__ */ nn.createElement(kd, { ...r }))), "render")
|
|
11615
11616
|
});
|
|
11616
11617
|
}
|
|
11617
11618
|
});
|
|
11618
11619
|
|
|
11619
11620
|
// src/backgrounds/manager.tsx
|
|
11620
|
-
import
|
|
11621
|
-
import { addons as Bd, types as
|
|
11621
|
+
import VS from "react";
|
|
11622
|
+
import { addons as Bd, types as zS } from "storybook/manager-api";
|
|
11622
11623
|
|
|
11623
11624
|
// src/backgrounds/components/Tool.tsx
|
|
11624
|
-
import Je, { Fragment as
|
|
11625
|
-
import { IconButton as Nd, TooltipLinkList as
|
|
11626
|
-
import { CircleIcon as
|
|
11627
|
-
import { useGlobals as
|
|
11625
|
+
import Je, { Fragment as IS, memo as _d, useCallback as PS, useState as LS } from "react";
|
|
11626
|
+
import { IconButton as Nd, TooltipLinkList as NS, WithTooltip as _S } from "storybook/internal/components";
|
|
11627
|
+
import { CircleIcon as DS, GridIcon as BS, PhotoIcon as MS, RefreshIcon as FS } from "@storybook/icons";
|
|
11628
|
+
import { useGlobals as jS, useParameter as RS } from "storybook/manager-api";
|
|
11628
11629
|
|
|
11629
11630
|
// src/backgrounds/constants.ts
|
|
11630
11631
|
var an = "storybook/background", _r = "backgrounds";
|
|
11631
|
-
var
|
|
11632
|
+
var kM = {
|
|
11632
11633
|
UPDATE: `${an}/update`
|
|
11633
11634
|
};
|
|
11634
11635
|
|
|
@@ -11640,12 +11641,12 @@ var Ld = {
|
|
|
11640
11641
|
|
|
11641
11642
|
// src/backgrounds/components/Tool.tsx
|
|
11642
11643
|
var Dd = _d(/* @__PURE__ */ a(function() {
|
|
11643
|
-
let t =
|
|
11644
|
+
let t = RS(_r), [r, o, n] = jS(), [i, s] = LS(!1), { options: l = Ld, disable: c = !0 } = t || {};
|
|
11644
11645
|
if (c)
|
|
11645
11646
|
return null;
|
|
11646
11647
|
let u = r[_r] || {}, d = u.value, g = u.grid || !1, p = l[d], m = !!n?.[_r], f = Object.keys(l).length;
|
|
11647
11648
|
return /* @__PURE__ */ Je.createElement(
|
|
11648
|
-
|
|
11649
|
+
HS,
|
|
11649
11650
|
{
|
|
11650
11651
|
length: f,
|
|
11651
11652
|
backgroundMap: l,
|
|
@@ -11658,7 +11659,7 @@ var Dd = _d(/* @__PURE__ */ a(function() {
|
|
|
11658
11659
|
isTooltipVisible: i
|
|
11659
11660
|
}
|
|
11660
11661
|
);
|
|
11661
|
-
}, "BackgroundSelector")),
|
|
11662
|
+
}, "BackgroundSelector")), HS = _d(/* @__PURE__ */ a(function(t) {
|
|
11662
11663
|
let {
|
|
11663
11664
|
item: r,
|
|
11664
11665
|
length: o,
|
|
@@ -11669,7 +11670,7 @@ var Dd = _d(/* @__PURE__ */ a(function() {
|
|
|
11669
11670
|
isLocked: c,
|
|
11670
11671
|
isGridActive: u,
|
|
11671
11672
|
isTooltipVisible: d
|
|
11672
|
-
} = t, g =
|
|
11673
|
+
} = t, g = PS(
|
|
11673
11674
|
(p) => {
|
|
11674
11675
|
n({
|
|
11675
11676
|
[_r]: p
|
|
@@ -11677,7 +11678,7 @@ var Dd = _d(/* @__PURE__ */ a(function() {
|
|
|
11677
11678
|
},
|
|
11678
11679
|
[n]
|
|
11679
11680
|
);
|
|
11680
|
-
return /* @__PURE__ */ Je.createElement(
|
|
11681
|
+
return /* @__PURE__ */ Je.createElement(IS, null, /* @__PURE__ */ Je.createElement(
|
|
11681
11682
|
Nd,
|
|
11682
11683
|
{
|
|
11683
11684
|
key: "grid",
|
|
@@ -11686,22 +11687,22 @@ var Dd = _d(/* @__PURE__ */ a(function() {
|
|
|
11686
11687
|
title: "Apply a grid to the preview",
|
|
11687
11688
|
onClick: () => g({ value: l, grid: !u })
|
|
11688
11689
|
},
|
|
11689
|
-
/* @__PURE__ */ Je.createElement(
|
|
11690
|
+
/* @__PURE__ */ Je.createElement(BS, null)
|
|
11690
11691
|
), o > 0 ? /* @__PURE__ */ Je.createElement(
|
|
11691
|
-
|
|
11692
|
+
_S,
|
|
11692
11693
|
{
|
|
11693
11694
|
key: "background",
|
|
11694
11695
|
placement: "top",
|
|
11695
11696
|
closeOnOutsideClick: !0,
|
|
11696
11697
|
tooltip: ({ onHide: p }) => /* @__PURE__ */ Je.createElement(
|
|
11697
|
-
|
|
11698
|
+
NS,
|
|
11698
11699
|
{
|
|
11699
11700
|
links: [
|
|
11700
11701
|
...r ? [
|
|
11701
11702
|
{
|
|
11702
11703
|
id: "reset",
|
|
11703
11704
|
title: "Reset background",
|
|
11704
|
-
icon: /* @__PURE__ */ Je.createElement(
|
|
11705
|
+
icon: /* @__PURE__ */ Je.createElement(FS, null),
|
|
11705
11706
|
onClick: /* @__PURE__ */ a(() => {
|
|
11706
11707
|
g(void 0), p();
|
|
11707
11708
|
}, "onClick")
|
|
@@ -11710,7 +11711,7 @@ var Dd = _d(/* @__PURE__ */ a(function() {
|
|
|
11710
11711
|
...Object.entries(s).map(([m, f]) => ({
|
|
11711
11712
|
id: m,
|
|
11712
11713
|
title: f.name,
|
|
11713
|
-
icon: /* @__PURE__ */ Je.createElement(
|
|
11714
|
+
icon: /* @__PURE__ */ Je.createElement(DS, { color: f?.value || "grey" }),
|
|
11714
11715
|
active: m === l,
|
|
11715
11716
|
onClick: /* @__PURE__ */ a(() => {
|
|
11716
11717
|
g({ value: m, grid: u }), p();
|
|
@@ -11729,7 +11730,7 @@ var Dd = _d(/* @__PURE__ */ a(function() {
|
|
|
11729
11730
|
title: "Change the background of the preview",
|
|
11730
11731
|
active: !!r || d
|
|
11731
11732
|
},
|
|
11732
|
-
/* @__PURE__ */ Je.createElement(
|
|
11733
|
+
/* @__PURE__ */ Je.createElement(MS, null)
|
|
11733
11734
|
)
|
|
11734
11735
|
) : null);
|
|
11735
11736
|
}, "PureTool"));
|
|
@@ -11738,25 +11739,25 @@ var Dd = _d(/* @__PURE__ */ a(function() {
|
|
|
11738
11739
|
var Md = Bd.register(an, () => {
|
|
11739
11740
|
globalThis?.FEATURES?.backgrounds && Bd.add(an, {
|
|
11740
11741
|
title: "Backgrounds",
|
|
11741
|
-
type:
|
|
11742
|
+
type: zS.TOOL,
|
|
11742
11743
|
match: /* @__PURE__ */ a(({ viewMode: e, tabId: t }) => !!(e && e.match(/^(story|docs)$/)) && !t, "match"),
|
|
11743
|
-
render: /* @__PURE__ */ a(() => /* @__PURE__ */
|
|
11744
|
+
render: /* @__PURE__ */ a(() => /* @__PURE__ */ VS.createElement(Dd, null), "render")
|
|
11744
11745
|
});
|
|
11745
11746
|
});
|
|
11746
11747
|
|
|
11747
11748
|
// src/measure/manager.tsx
|
|
11748
|
-
import
|
|
11749
|
-
import { addons as Rd, types as
|
|
11749
|
+
import KS from "react";
|
|
11750
|
+
import { addons as Rd, types as YS } from "storybook/manager-api";
|
|
11750
11751
|
|
|
11751
11752
|
// src/measure/Tool.tsx
|
|
11752
|
-
import Fd, { useCallback as
|
|
11753
|
-
import { IconButton as
|
|
11754
|
-
import { RulerIcon as
|
|
11755
|
-
import { useGlobals as
|
|
11753
|
+
import Fd, { useCallback as $S, useEffect as US } from "react";
|
|
11754
|
+
import { IconButton as qS } from "storybook/internal/components";
|
|
11755
|
+
import { RulerIcon as WS } from "@storybook/icons";
|
|
11756
|
+
import { useGlobals as GS, useStorybookApi as JS } from "storybook/manager-api";
|
|
11756
11757
|
|
|
11757
11758
|
// src/measure/constants.ts
|
|
11758
11759
|
var Et = "storybook/measure-addon", sn = `${Et}/tool`;
|
|
11759
|
-
var
|
|
11760
|
+
var UM = {
|
|
11760
11761
|
RESULT: `${Et}/result`,
|
|
11761
11762
|
REQUEST: `${Et}/request`,
|
|
11762
11763
|
CLEAR: `${Et}/clear`
|
|
@@ -11764,13 +11765,13 @@ var $M = {
|
|
|
11764
11765
|
|
|
11765
11766
|
// src/measure/Tool.tsx
|
|
11766
11767
|
var jd = /* @__PURE__ */ a(() => {
|
|
11767
|
-
let [e, t] =
|
|
11768
|
+
let [e, t] = GS(), { measureEnabled: r } = e || {}, o = JS(), n = $S(
|
|
11768
11769
|
() => t({
|
|
11769
11770
|
measureEnabled: !r
|
|
11770
11771
|
}),
|
|
11771
11772
|
[t, r]
|
|
11772
11773
|
);
|
|
11773
|
-
return
|
|
11774
|
+
return US(() => {
|
|
11774
11775
|
o.setAddonShortcut(Et, {
|
|
11775
11776
|
label: "Toggle Measure [M]",
|
|
11776
11777
|
defaultShortcut: ["M"],
|
|
@@ -11779,49 +11780,49 @@ var jd = /* @__PURE__ */ a(() => {
|
|
|
11779
11780
|
action: n
|
|
11780
11781
|
});
|
|
11781
11782
|
}, [n, o]), /* @__PURE__ */ Fd.createElement(
|
|
11782
|
-
|
|
11783
|
+
qS,
|
|
11783
11784
|
{
|
|
11784
11785
|
key: sn,
|
|
11785
11786
|
active: r,
|
|
11786
11787
|
title: "Enable measure",
|
|
11787
11788
|
onClick: n
|
|
11788
11789
|
},
|
|
11789
|
-
/* @__PURE__ */ Fd.createElement(
|
|
11790
|
+
/* @__PURE__ */ Fd.createElement(WS, null)
|
|
11790
11791
|
);
|
|
11791
11792
|
}, "Tool");
|
|
11792
11793
|
|
|
11793
11794
|
// src/measure/manager.tsx
|
|
11794
11795
|
var Hd = Rd.register(Et, () => {
|
|
11795
11796
|
globalThis?.FEATURES?.measure && Rd.add(sn, {
|
|
11796
|
-
type:
|
|
11797
|
+
type: YS.TOOL,
|
|
11797
11798
|
title: "Measure",
|
|
11798
11799
|
match: /* @__PURE__ */ a(({ viewMode: e, tabId: t }) => e === "story" && !t, "match"),
|
|
11799
|
-
render: /* @__PURE__ */ a(() => /* @__PURE__ */
|
|
11800
|
+
render: /* @__PURE__ */ a(() => /* @__PURE__ */ KS.createElement(jd, null), "render")
|
|
11800
11801
|
});
|
|
11801
11802
|
});
|
|
11802
11803
|
|
|
11803
11804
|
// src/outline/manager.tsx
|
|
11804
|
-
import
|
|
11805
|
-
import { addons as $d, types as
|
|
11805
|
+
import nC from "react";
|
|
11806
|
+
import { addons as $d, types as aC } from "storybook/manager-api";
|
|
11806
11807
|
|
|
11807
11808
|
// src/outline/OutlineSelector.tsx
|
|
11808
|
-
import Vd, { memo as
|
|
11809
|
-
import { IconButton as
|
|
11810
|
-
import { OutlineIcon as
|
|
11811
|
-
import { useGlobals as
|
|
11809
|
+
import Vd, { memo as XS, useCallback as ZS, useEffect as QS } from "react";
|
|
11810
|
+
import { IconButton as eC } from "storybook/internal/components";
|
|
11811
|
+
import { OutlineIcon as tC } from "@storybook/icons";
|
|
11812
|
+
import { useGlobals as rC, useStorybookApi as oC } from "storybook/manager-api";
|
|
11812
11813
|
|
|
11813
11814
|
// src/outline/constants.ts
|
|
11814
11815
|
var Dr = "storybook/outline", Ai = "outline";
|
|
11815
11816
|
|
|
11816
11817
|
// src/outline/OutlineSelector.tsx
|
|
11817
|
-
var zd =
|
|
11818
|
-
let [t, r] =
|
|
11818
|
+
var zd = XS(/* @__PURE__ */ a(function() {
|
|
11819
|
+
let [t, r] = rC(), o = oC(), n = [!0, "true"].includes(t[Ai]), i = ZS(
|
|
11819
11820
|
() => r({
|
|
11820
11821
|
[Ai]: !n
|
|
11821
11822
|
}),
|
|
11822
11823
|
[n]
|
|
11823
11824
|
);
|
|
11824
|
-
return
|
|
11825
|
+
return QS(() => {
|
|
11825
11826
|
o.setAddonShortcut(Dr, {
|
|
11826
11827
|
label: "Toggle Outline",
|
|
11827
11828
|
defaultShortcut: ["alt", "O"],
|
|
@@ -11830,14 +11831,14 @@ var zd = YS(/* @__PURE__ */ a(function() {
|
|
|
11830
11831
|
action: i
|
|
11831
11832
|
});
|
|
11832
11833
|
}, [i, o]), /* @__PURE__ */ Vd.createElement(
|
|
11833
|
-
|
|
11834
|
+
eC,
|
|
11834
11835
|
{
|
|
11835
11836
|
key: "outline",
|
|
11836
11837
|
active: n,
|
|
11837
11838
|
title: "Apply outlines to the preview",
|
|
11838
11839
|
onClick: i
|
|
11839
11840
|
},
|
|
11840
|
-
/* @__PURE__ */ Vd.createElement(
|
|
11841
|
+
/* @__PURE__ */ Vd.createElement(tC, null)
|
|
11841
11842
|
);
|
|
11842
11843
|
}, "OutlineSelector"));
|
|
11843
11844
|
|
|
@@ -11845,25 +11846,25 @@ var zd = YS(/* @__PURE__ */ a(function() {
|
|
|
11845
11846
|
var Ud = $d.register(Dr, () => {
|
|
11846
11847
|
globalThis?.FEATURES?.outline && $d.add(Dr, {
|
|
11847
11848
|
title: "Outline",
|
|
11848
|
-
type:
|
|
11849
|
+
type: aC.TOOL,
|
|
11849
11850
|
match: /* @__PURE__ */ a(({ viewMode: e, tabId: t }) => !!(e && e.match(/^(story|docs)$/)) && !t, "match"),
|
|
11850
|
-
render: /* @__PURE__ */ a(() => /* @__PURE__ */
|
|
11851
|
+
render: /* @__PURE__ */ a(() => /* @__PURE__ */ nC.createElement(zd, null), "render")
|
|
11851
11852
|
});
|
|
11852
11853
|
});
|
|
11853
11854
|
|
|
11854
11855
|
// src/viewport/manager.tsx
|
|
11855
11856
|
import * as tf from "react";
|
|
11856
|
-
import { addons as ef, types as
|
|
11857
|
+
import { addons as ef, types as kC } from "storybook/manager-api";
|
|
11857
11858
|
|
|
11858
11859
|
// src/viewport/components/Tool.tsx
|
|
11859
|
-
import Se, { Fragment as
|
|
11860
|
-
import { IconButton as
|
|
11861
|
-
import { GrowIcon as
|
|
11862
|
-
import { useGlobals as
|
|
11863
|
-
import { Global as
|
|
11860
|
+
import Se, { Fragment as fC, useCallback as mC, useEffect as gC, useState as hC } from "react";
|
|
11861
|
+
import { IconButton as bC, TooltipLinkList as yC, WithTooltip as xC } from "storybook/internal/components";
|
|
11862
|
+
import { GrowIcon as vC, RefreshIcon as EC, TransferIcon as SC } from "@storybook/icons";
|
|
11863
|
+
import { useGlobals as CC, useParameter as wC } from "storybook/manager-api";
|
|
11864
|
+
import { Global as TC } from "storybook/theming";
|
|
11864
11865
|
|
|
11865
11866
|
// src/viewport/constants.ts
|
|
11866
|
-
var St = "storybook/viewport", Br = "viewport",
|
|
11867
|
+
var St = "storybook/viewport", Br = "viewport", x3 = `${St}/panel`, qd = `${St}/tool`;
|
|
11867
11868
|
|
|
11868
11869
|
// src/viewport/defaults.ts
|
|
11869
11870
|
var Wd = {
|
|
@@ -11912,10 +11913,10 @@ var tr = {
|
|
|
11912
11913
|
};
|
|
11913
11914
|
|
|
11914
11915
|
// src/viewport/shortcuts.ts
|
|
11915
|
-
var Gd = /* @__PURE__ */ a((e, t) => e.indexOf(t), "getCurrentViewportIndex"),
|
|
11916
|
+
var Gd = /* @__PURE__ */ a((e, t) => e.indexOf(t), "getCurrentViewportIndex"), iC = /* @__PURE__ */ a((e, t) => {
|
|
11916
11917
|
let r = Gd(e, t);
|
|
11917
11918
|
return r === e.length - 1 ? e[0] : e[r + 1];
|
|
11918
|
-
}, "getNextViewport"),
|
|
11919
|
+
}, "getNextViewport"), sC = /* @__PURE__ */ a((e, t) => {
|
|
11919
11920
|
let r = Gd(e, t);
|
|
11920
11921
|
return r < 1 ? e[e.length - 1] : e[r - 1];
|
|
11921
11922
|
}, "getPreviousViewport"), Jd = /* @__PURE__ */ a(async (e, t, r, o) => {
|
|
@@ -11925,7 +11926,7 @@ var Gd = /* @__PURE__ */ a((e, t) => e.indexOf(t), "getCurrentViewportIndex"), a
|
|
|
11925
11926
|
actionName: "previous",
|
|
11926
11927
|
action: /* @__PURE__ */ a(() => {
|
|
11927
11928
|
r({
|
|
11928
|
-
viewport:
|
|
11929
|
+
viewport: sC(o, t)
|
|
11929
11930
|
});
|
|
11930
11931
|
}, "action")
|
|
11931
11932
|
}), await e.setAddonShortcut(St, {
|
|
@@ -11934,7 +11935,7 @@ var Gd = /* @__PURE__ */ a((e, t) => e.indexOf(t), "getCurrentViewportIndex"), a
|
|
|
11934
11935
|
actionName: "next",
|
|
11935
11936
|
action: /* @__PURE__ */ a(() => {
|
|
11936
11937
|
r({
|
|
11937
|
-
viewport:
|
|
11938
|
+
viewport: iC(o, t)
|
|
11938
11939
|
});
|
|
11939
11940
|
}, "action")
|
|
11940
11941
|
}), await e.setAddonShortcut(St, {
|
|
@@ -11950,9 +11951,9 @@ var Gd = /* @__PURE__ */ a((e, t) => e.indexOf(t), "getCurrentViewportIndex"), a
|
|
|
11950
11951
|
}, "registerShortcuts");
|
|
11951
11952
|
|
|
11952
11953
|
// src/viewport/utils.tsx
|
|
11953
|
-
import ln, { Fragment as
|
|
11954
|
-
import { IconButton as
|
|
11955
|
-
import { BrowserIcon as
|
|
11954
|
+
import ln, { Fragment as lC } from "react";
|
|
11955
|
+
import { IconButton as cC } from "storybook/internal/components";
|
|
11956
|
+
import { BrowserIcon as pC, MobileIcon as uC, TabletIcon as dC } from "@storybook/icons";
|
|
11956
11957
|
import { styled as cn } from "storybook/theming";
|
|
11957
11958
|
var Kd = cn.div({
|
|
11958
11959
|
display: "inline-flex",
|
|
@@ -11969,24 +11970,24 @@ var Kd = cn.div({
|
|
|
11969
11970
|
borderTop: "3px solid transparent",
|
|
11970
11971
|
borderBottom: "3px solid transparent",
|
|
11971
11972
|
background: "transparent"
|
|
11972
|
-
})), Yd = cn(
|
|
11973
|
+
})), Yd = cn(cC)(() => ({
|
|
11973
11974
|
display: "inline-flex",
|
|
11974
11975
|
alignItems: "center"
|
|
11975
11976
|
})), Xd = cn.div(({ theme: e }) => ({
|
|
11976
11977
|
fontSize: e.typography.size.s2 - 1,
|
|
11977
11978
|
marginLeft: 10
|
|
11978
11979
|
})), Zd = {
|
|
11979
|
-
desktop: /* @__PURE__ */ ln.createElement(
|
|
11980
|
-
mobile: /* @__PURE__ */ ln.createElement(
|
|
11981
|
-
tablet: /* @__PURE__ */ ln.createElement(
|
|
11982
|
-
other: /* @__PURE__ */ ln.createElement(
|
|
11980
|
+
desktop: /* @__PURE__ */ ln.createElement(pC, null),
|
|
11981
|
+
mobile: /* @__PURE__ */ ln.createElement(uC, null),
|
|
11982
|
+
tablet: /* @__PURE__ */ ln.createElement(dC, null),
|
|
11983
|
+
other: /* @__PURE__ */ ln.createElement(lC, null)
|
|
11983
11984
|
};
|
|
11984
11985
|
|
|
11985
11986
|
// src/viewport/components/Tool.tsx
|
|
11986
11987
|
var Qd = /* @__PURE__ */ a(({ api: e }) => {
|
|
11987
|
-
let t =
|
|
11988
|
+
let t = wC(Br), [r, o, n] = CC(), [i, s] = hC(!1), { options: l = Wd, disable: c } = t || {}, u = r?.[Br] || {}, d = typeof u == "string" ?
|
|
11988
11989
|
u : u.value, g = typeof u == "string" ? !1 : u.isRotated, p = l[d] || tr, m = i || p !== tr, f = Br in n, h = Object.keys(l).length;
|
|
11989
|
-
if (
|
|
11990
|
+
if (gC(() => {
|
|
11990
11991
|
Jd(e, d, o, Object.keys(l));
|
|
11991
11992
|
}, [l, d, o, e]), p.styles === null || !l || h < 1)
|
|
11992
11993
|
return null;
|
|
@@ -11996,7 +11997,7 @@ var Qd = /* @__PURE__ */ a(({ api: e }) => {
|
|
|
11996
11997
|
), null;
|
|
11997
11998
|
let b = g ? p.styles.height : p.styles.width, y = g ? p.styles.width : p.styles.height;
|
|
11998
11999
|
return c ? null : /* @__PURE__ */ Se.createElement(
|
|
11999
|
-
|
|
12000
|
+
AC,
|
|
12000
12001
|
{
|
|
12001
12002
|
item: p,
|
|
12002
12003
|
updateGlobals: o,
|
|
@@ -12010,7 +12011,7 @@ var Qd = /* @__PURE__ */ a(({ api: e }) => {
|
|
|
12010
12011
|
height: y
|
|
12011
12012
|
}
|
|
12012
12013
|
);
|
|
12013
|
-
}, "ViewportTool"),
|
|
12014
|
+
}, "ViewportTool"), AC = Se.memo(/* @__PURE__ */ a(function(t) {
|
|
12014
12015
|
let {
|
|
12015
12016
|
item: r,
|
|
12016
12017
|
viewportMap: o,
|
|
@@ -12022,23 +12023,23 @@ var Qd = /* @__PURE__ */ a(({ api: e }) => {
|
|
|
12022
12023
|
isActive: u,
|
|
12023
12024
|
width: d,
|
|
12024
12025
|
height: g
|
|
12025
|
-
} = t, p =
|
|
12026
|
+
} = t, p = mC(
|
|
12026
12027
|
(m) => s({ [Br]: m }),
|
|
12027
12028
|
[s]
|
|
12028
12029
|
);
|
|
12029
|
-
return /* @__PURE__ */ Se.createElement(
|
|
12030
|
-
|
|
12030
|
+
return /* @__PURE__ */ Se.createElement(fC, null, /* @__PURE__ */ Se.createElement(
|
|
12031
|
+
xC,
|
|
12031
12032
|
{
|
|
12032
12033
|
placement: "bottom",
|
|
12033
12034
|
tooltip: ({ onHide: m }) => /* @__PURE__ */ Se.createElement(
|
|
12034
|
-
|
|
12035
|
+
yC,
|
|
12035
12036
|
{
|
|
12036
12037
|
links: [
|
|
12037
12038
|
...length > 0 && r !== tr ? [
|
|
12038
12039
|
{
|
|
12039
12040
|
id: "reset",
|
|
12040
12041
|
title: "Reset viewport",
|
|
12041
|
-
icon: /* @__PURE__ */ Se.createElement(
|
|
12042
|
+
icon: /* @__PURE__ */ Se.createElement(EC, null),
|
|
12042
12043
|
onClick: /* @__PURE__ */ a(() => {
|
|
12043
12044
|
p(void 0), m();
|
|
12044
12045
|
}, "onClick")
|
|
@@ -12070,11 +12071,11 @@ var Qd = /* @__PURE__ */ a(({ api: e }) => {
|
|
|
12070
12071
|
p({ value: void 0, isRotated: !1 });
|
|
12071
12072
|
}
|
|
12072
12073
|
},
|
|
12073
|
-
/* @__PURE__ */ Se.createElement(
|
|
12074
|
+
/* @__PURE__ */ Se.createElement(vC, null),
|
|
12074
12075
|
r !== tr ? /* @__PURE__ */ Se.createElement(Xd, null, r.name, " ", i ? "(L)" : "(P)") : null
|
|
12075
12076
|
)
|
|
12076
12077
|
), /* @__PURE__ */ Se.createElement(
|
|
12077
|
-
|
|
12078
|
+
TC,
|
|
12078
12079
|
{
|
|
12079
12080
|
styles: {
|
|
12080
12081
|
'iframe[data-is-storybook="true"]': { width: d, height: g }
|
|
@@ -12082,7 +12083,7 @@ var Qd = /* @__PURE__ */ a(({ api: e }) => {
|
|
|
12082
12083
|
}
|
|
12083
12084
|
), r !== tr ? /* @__PURE__ */ Se.createElement(Kd, null, /* @__PURE__ */ Se.createElement(ki, { title: "Viewport width" }, d.replace("px",
|
|
12084
12085
|
"")), c ? "/" : /* @__PURE__ */ Se.createElement(
|
|
12085
|
-
|
|
12086
|
+
bC,
|
|
12086
12087
|
{
|
|
12087
12088
|
key: "viewport-rotate",
|
|
12088
12089
|
title: "Rotate viewport",
|
|
@@ -12090,7 +12091,7 @@ var Qd = /* @__PURE__ */ a(({ api: e }) => {
|
|
|
12090
12091
|
p({ value: n, isRotated: !i });
|
|
12091
12092
|
}
|
|
12092
12093
|
},
|
|
12093
|
-
/* @__PURE__ */ Se.createElement(
|
|
12094
|
+
/* @__PURE__ */ Se.createElement(SC, null)
|
|
12094
12095
|
), /* @__PURE__ */ Se.createElement(ki, { title: "Viewport height" }, g.replace("px", ""))) : null);
|
|
12095
12096
|
}, "PureTool"));
|
|
12096
12097
|
|
|
@@ -12098,31 +12099,31 @@ var Qd = /* @__PURE__ */ a(({ api: e }) => {
|
|
|
12098
12099
|
var rf = ef.register(St, (e) => {
|
|
12099
12100
|
globalThis?.FEATURES?.viewport && ef.add(qd, {
|
|
12100
12101
|
title: "viewport / media-queries",
|
|
12101
|
-
type:
|
|
12102
|
+
type: kC.TOOL,
|
|
12102
12103
|
match: /* @__PURE__ */ a(({ viewMode: t, tabId: r }) => t === "story" && !r, "match"),
|
|
12103
12104
|
render: /* @__PURE__ */ a(() => /* @__PURE__ */ tf.createElement(Qd, { api: e }), "render")
|
|
12104
12105
|
});
|
|
12105
12106
|
});
|
|
12106
12107
|
|
|
12107
12108
|
// src/core-server/presets/common-manager.ts
|
|
12108
|
-
var
|
|
12109
|
-
let t = Object.entries(
|
|
12109
|
+
var PC = "tag-filters", LC = "static-filter", NC = IC.register(PC, (e) => {
|
|
12110
|
+
let t = Object.entries(OC.TAGS_OPTIONS ?? {}).reduce(
|
|
12110
12111
|
(r, o) => {
|
|
12111
12112
|
let [n, i] = o;
|
|
12112
12113
|
return i.excludeFromSidebar && (r[n] = !0), r;
|
|
12113
12114
|
},
|
|
12114
12115
|
{}
|
|
12115
12116
|
);
|
|
12116
|
-
e.experimental_setFilter(
|
|
12117
|
+
e.experimental_setFilter(LC, (r) => {
|
|
12117
12118
|
let o = r.tags ?? [];
|
|
12118
12119
|
return (
|
|
12119
12120
|
// we can filter out the primary story, but we still want to show autodocs
|
|
12120
12121
|
(o.includes("dev") || r.type === "docs") && o.filter((n) => t[n]).length === 0
|
|
12121
12122
|
);
|
|
12122
12123
|
});
|
|
12123
|
-
}),
|
|
12124
|
+
}), oF = [
|
|
12124
12125
|
Hd,
|
|
12125
|
-
|
|
12126
|
+
NC,
|
|
12126
12127
|
Vp,
|
|
12127
12128
|
Md,
|
|
12128
12129
|
Pd,
|
|
@@ -12131,5 +12132,5 @@ var IC = "tag-filters", PC = "static-filter", LC = OC.register(IC, (e) => {
|
|
|
12131
12132
|
Ud
|
|
12132
12133
|
];
|
|
12133
12134
|
export {
|
|
12134
|
-
|
|
12135
|
+
oF as default
|
|
12135
12136
|
};
|