storybook 10.1.0-beta.0 → 10.1.0-beta.1
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/_node-chunks/{builder-manager-BDAQHXFI.js → builder-manager-FTVC2JL7.js} +12 -12
- package/dist/_node-chunks/{camelcase-3C7DZZPX.js → camelcase-3SMT5WKC.js} +7 -7
- package/dist/_node-chunks/{chunk-UFOFO5H7.js → chunk-2OVULPK3.js} +6 -6
- package/dist/_node-chunks/{chunk-56U5LEMP.js → chunk-3JJPSDXI.js} +9 -9
- package/dist/_node-chunks/{chunk-CN2IW2KQ.js → chunk-54NMJ4II.js} +8 -8
- package/dist/_node-chunks/{chunk-CQMAU6UQ.js → chunk-5V4A6MSI.js} +7 -7
- package/dist/_node-chunks/{chunk-OZZO56XN.js → chunk-6DEMT5VX.js} +13 -13
- package/dist/_node-chunks/{chunk-BG4RDXG7.js → chunk-6L7FFBOW.js} +6 -6
- package/dist/_node-chunks/{chunk-WURL4XOT.js → chunk-6ULDIDXV.js} +9 -9
- package/dist/_node-chunks/{chunk-7RN6TXKP.js → chunk-AREL5IXS.js} +7 -7
- package/dist/_node-chunks/chunk-DWA53E73.js +23 -0
- package/dist/_node-chunks/{chunk-YV3GDSDT.js → chunk-FNYKBULZ.js} +7 -7
- package/dist/_node-chunks/{chunk-W6MAMTUF.js → chunk-IUYZQKSX.js} +6 -6
- package/dist/_node-chunks/{chunk-KVRF22SH.js → chunk-K673CX4Q.js} +7 -7
- package/dist/_node-chunks/chunk-KJAFCNZ3.js +61 -0
- package/dist/_node-chunks/{chunk-POT2EVGD.js → chunk-N3BJOOY5.js} +6 -6
- package/dist/_node-chunks/{chunk-D6ND3TVY.js → chunk-O5FMCQHP.js} +10 -10
- package/dist/_node-chunks/{chunk-O5CGEVRI.js → chunk-RIKQZHV3.js} +6 -6
- package/dist/_node-chunks/{chunk-R5YGFSTV.js → chunk-RURZIE3W.js} +10 -11
- package/dist/_node-chunks/{chunk-LEDP4QQW.js → chunk-RVII4SK6.js} +14 -14
- package/dist/_node-chunks/{chunk-2IIQTGNE.js → chunk-S3PBHOVC.js} +12 -12
- package/dist/_node-chunks/{chunk-XGK6MVKR.js → chunk-SQSFX47N.js} +7 -7
- package/dist/_node-chunks/{chunk-EVK2SBW5.js → chunk-TURUTKVH.js} +7 -7
- package/dist/_node-chunks/{chunk-VBF7ALJF.js → chunk-VRICJPXY.js} +6 -6
- package/dist/_node-chunks/{chunk-IXWEUXJ2.js → chunk-WIWWMCEU.js} +6 -6
- package/dist/_node-chunks/{chunk-YWV55YW3.js → chunk-XGNRK7QB.js} +7 -7
- package/dist/_node-chunks/{chunk-7SJ7PZNL.js → chunk-Y2FOTPAE.js} +7 -7
- package/dist/_node-chunks/{chunk-MMVV6DGG.js → chunk-Y4UYN72K.js} +20 -20
- package/dist/_node-chunks/chunk-Z4BMBA5L.js +18 -0
- package/dist/_node-chunks/{chunk-7LIRCAQE.js → chunk-ZMCJS2GU.js} +6 -6
- package/dist/_node-chunks/{dist-KEP4IFRN.js → dist-TZLZ3T6L.js} +9 -9
- package/dist/_node-chunks/{globby-4WUBTDCN.js → globby-22GFCZQD.js} +9 -9
- package/dist/_node-chunks/{lib-JVOEKTYM.js → lib-37NQ4ZIJ.js} +7 -7
- package/dist/_node-chunks/{mdx-N42X6CFJ-C5WFYYXR.js → mdx-N42X6CFJ-2TRB7OEH.js} +8 -8
- package/dist/_node-chunks/{p-limit-LDY632RS.js → p-limit-UD7TYFDW.js} +7 -7
- package/dist/babel/index.js +10 -10
- package/dist/bin/core.js +16 -16
- package/dist/bin/dispatcher.js +11 -11
- package/dist/bin/loader.js +9 -9
- package/dist/cli/index.js +18 -18
- package/dist/common/index.js +19 -19
- package/dist/core-server/index.js +43 -41
- package/dist/core-server/presets/common-override-preset.js +9 -9
- package/dist/core-server/presets/common-preset.js +25 -25
- package/dist/csf-tools/index.js +9 -9
- package/dist/manager/globals-runtime.js +3 -3
- package/dist/manager/runtime.js +120 -62
- package/dist/manager-api/index.d.ts +4 -2
- package/dist/manager-api/index.js +3 -3
- package/dist/mocking-utils/index.js +8 -8
- package/dist/node-logger/index.js +9 -9
- package/dist/preview-api/index.d.ts +68 -67
- package/dist/server-errors.js +11 -11
- package/dist/telemetry/index.js +23 -23
- package/package.json +1 -1
- package/dist/_node-chunks/chunk-CBQKMXLQ.js +0 -18
- package/dist/_node-chunks/chunk-DC355CYB.js +0 -61
- package/dist/_node-chunks/chunk-SQCTM2OS.js +0 -23
package/dist/manager/runtime.js
CHANGED
|
@@ -10667,7 +10667,7 @@ var CodeWrapper = styled.div(({ theme }) => ({
|
|
|
10667
10667
|
{
|
|
10668
10668
|
id: "guidedTour",
|
|
10669
10669
|
label: "Take the guided tour",
|
|
10670
|
-
available: ({ index }) => !!index && "example-button--primary" in index && addons.experimental_getRegisteredAddons().includes(ADDON_ID2),
|
|
10670
|
+
available: ({ index }) => !!index && "example-button--primary" in index && !!globalThis?.FEATURES?.controls && addons.experimental_getRegisteredAddons().includes(ADDON_ID2),
|
|
10671
10671
|
criteria: "Guided tour is completed",
|
|
10672
10672
|
subscribe: ({ api, accept }) => api.on(ADDON_ONBOARDING_CHANNEL, ({ step, type }) => {
|
|
10673
10673
|
type !== "dismiss" && ["6:IntentSurvey", "7:FinishedOnboarding"].includes(step) && accept();
|
|
@@ -10703,14 +10703,22 @@ var CodeWrapper = styled.div(({ theme }) => ({
|
|
|
10703
10703
|
content: ({ api }) => react_default.createElement(react_default.Fragment, null, react_default.createElement("p", null, "Storybook renders your components in isolation, using stories. That allows you to work on the bit of UI you need, without worrying about the rest of the app."), react_default.createElement("p", null, "Rendering your components can often require", " ", react_default.createElement(
|
|
10704
10704
|
Link,
|
|
10705
10705
|
{
|
|
10706
|
-
href: api.getDocsUrl({
|
|
10706
|
+
href: api.getDocsUrl({
|
|
10707
|
+
subpath: "writing-stories/decorators",
|
|
10708
|
+
renderer: !0,
|
|
10709
|
+
ref: "guide"
|
|
10710
|
+
}),
|
|
10707
10711
|
target: "_blank"
|
|
10708
10712
|
},
|
|
10709
10713
|
"setting up surrounding context in decorators"
|
|
10710
10714
|
), " ", "or", " ", react_default.createElement(
|
|
10711
10715
|
Link,
|
|
10712
10716
|
{
|
|
10713
|
-
href: api.getDocsUrl({
|
|
10717
|
+
href: api.getDocsUrl({
|
|
10718
|
+
subpath: "configure/styling-and-css",
|
|
10719
|
+
renderer: !0,
|
|
10720
|
+
ref: "guide"
|
|
10721
|
+
}),
|
|
10714
10722
|
target: "_blank"
|
|
10715
10723
|
},
|
|
10716
10724
|
"applying global styles"
|
|
@@ -10738,7 +10746,11 @@ export const Primary: Story = {
|
|
|
10738
10746
|
};`), react_default.createElement("p", null, react_default.createElement(
|
|
10739
10747
|
Link,
|
|
10740
10748
|
{
|
|
10741
|
-
href: api.getDocsUrl({
|
|
10749
|
+
href: api.getDocsUrl({
|
|
10750
|
+
subpath: "writing-stories",
|
|
10751
|
+
renderer: !0,
|
|
10752
|
+
ref: "guide"
|
|
10753
|
+
}),
|
|
10742
10754
|
target: "_blank",
|
|
10743
10755
|
withArrow: !0
|
|
10744
10756
|
},
|
|
@@ -10752,7 +10764,10 @@ export const Primary: Story = {
|
|
|
10752
10764
|
content: ({ api }) => react_default.createElement(react_default.Fragment, null, react_default.createElement("p", null, "Storybook gets better as you add more components. Start with the easy ones, like Button or Avatar, and work your way up to more complex components, like Select, Autocomplete, or even full pages."), react_default.createElement(
|
|
10753
10765
|
"img",
|
|
10754
10766
|
{
|
|
10755
|
-
src: api.getDocsUrl({
|
|
10767
|
+
src: api.getDocsUrl({
|
|
10768
|
+
asset: "onboarding/sidebar-components.png",
|
|
10769
|
+
ref: "guide"
|
|
10770
|
+
}),
|
|
10756
10771
|
alt: "Components in the sidebar"
|
|
10757
10772
|
}
|
|
10758
10773
|
), react_default.createElement("p", null, react_default.createElement(
|
|
@@ -10760,7 +10775,8 @@ export const Primary: Story = {
|
|
|
10760
10775
|
{
|
|
10761
10776
|
href: api.getDocsUrl({
|
|
10762
10777
|
subpath: "get-started/whats-a-story#create-a-new-story",
|
|
10763
|
-
renderer: !0
|
|
10778
|
+
renderer: !0,
|
|
10779
|
+
ref: "guide"
|
|
10764
10780
|
}),
|
|
10765
10781
|
target: "_blank",
|
|
10766
10782
|
withArrow: !0
|
|
@@ -10783,8 +10799,8 @@ export const Primary: Story = {
|
|
|
10783
10799
|
"img",
|
|
10784
10800
|
{
|
|
10785
10801
|
src: api.getDocsUrl({
|
|
10786
|
-
|
|
10787
|
-
|
|
10802
|
+
asset: "onboarding/sidebar-many-stories.png",
|
|
10803
|
+
ref: "guide"
|
|
10788
10804
|
}),
|
|
10789
10805
|
alt: "Stories in the sidebar"
|
|
10790
10806
|
}
|
|
@@ -10793,7 +10809,8 @@ export const Primary: Story = {
|
|
|
10793
10809
|
{
|
|
10794
10810
|
href: api.getDocsUrl({
|
|
10795
10811
|
subpath: "essentials/controls#creating-and-editing-stories-from-controls",
|
|
10796
|
-
renderer: !0
|
|
10812
|
+
renderer: !0,
|
|
10813
|
+
ref: "guide"
|
|
10797
10814
|
}),
|
|
10798
10815
|
target: "_blank",
|
|
10799
10816
|
withArrow: !0
|
|
@@ -10826,18 +10843,26 @@ export const Primary: Story = {
|
|
|
10826
10843
|
id: "controls",
|
|
10827
10844
|
after: ["renderComponent"],
|
|
10828
10845
|
label: "Change a story with Controls",
|
|
10846
|
+
available: () => !!globalThis?.FEATURES?.controls,
|
|
10829
10847
|
criteria: "Story args are updated",
|
|
10830
10848
|
subscribe: ({ api, done }) => api.on(STORY_ARGS_UPDATED, done),
|
|
10831
10849
|
content: ({ api }) => react_default.createElement(react_default.Fragment, null, react_default.createElement("p", null, "When you change the value of one of the inputs in the Controls table, the story automatically updates to reflect that change. It's a great way to explore how a component handles various inputs."), react_default.createElement(
|
|
10832
10850
|
"img",
|
|
10833
10851
|
{
|
|
10834
|
-
src: api.getDocsUrl({
|
|
10852
|
+
src: api.getDocsUrl({
|
|
10853
|
+
asset: "api/doc-block-controls.png",
|
|
10854
|
+
ref: "guide"
|
|
10855
|
+
}),
|
|
10835
10856
|
alt: "Screenshot of Controls block"
|
|
10836
10857
|
}
|
|
10837
10858
|
), react_default.createElement("strong", null, "Take it further"), react_default.createElement("p", null, "Read the", " ", react_default.createElement(
|
|
10838
10859
|
Link,
|
|
10839
10860
|
{
|
|
10840
|
-
href: api.getDocsUrl({
|
|
10861
|
+
href: api.getDocsUrl({
|
|
10862
|
+
subpath: "essentials/controls",
|
|
10863
|
+
renderer: !0,
|
|
10864
|
+
ref: "guide"
|
|
10865
|
+
}),
|
|
10841
10866
|
target: "_blank"
|
|
10842
10867
|
},
|
|
10843
10868
|
"Controls documentation"
|
|
@@ -10847,18 +10872,26 @@ export const Primary: Story = {
|
|
|
10847
10872
|
id: "viewports",
|
|
10848
10873
|
after: ["renderComponent"],
|
|
10849
10874
|
label: "Check responsiveness with Viewports",
|
|
10875
|
+
available: () => !!globalThis?.FEATURES?.viewport,
|
|
10850
10876
|
criteria: "Viewport global is updated",
|
|
10851
10877
|
subscribe: ({ api, done }) => api.on(UPDATE_GLOBALS, ({ globals }) => globals?.viewport && done()),
|
|
10852
10878
|
content: ({ api }) => react_default.createElement(react_default.Fragment, null, react_default.createElement("p", null, "Many UI components need to be responsive to the viewport size. Storybook has built-in support for previewing stories in various device sizes."), react_default.createElement(
|
|
10853
10879
|
"img",
|
|
10854
10880
|
{
|
|
10855
|
-
src: api.getDocsUrl({
|
|
10881
|
+
src: api.getDocsUrl({
|
|
10882
|
+
asset: "onboarding/viewports-menu.png",
|
|
10883
|
+
ref: "guide"
|
|
10884
|
+
}),
|
|
10856
10885
|
alt: "Screenshot of Viewports menu"
|
|
10857
10886
|
}
|
|
10858
10887
|
), react_default.createElement("strong", null, "Take it further"), react_default.createElement("p", null, "Read the", " ", react_default.createElement(
|
|
10859
10888
|
Link,
|
|
10860
10889
|
{
|
|
10861
|
-
href: api.getDocsUrl({
|
|
10890
|
+
href: api.getDocsUrl({
|
|
10891
|
+
subpath: "essentials/viewport",
|
|
10892
|
+
renderer: !0,
|
|
10893
|
+
ref: "guide"
|
|
10894
|
+
}),
|
|
10862
10895
|
target: "_blank"
|
|
10863
10896
|
},
|
|
10864
10897
|
"Viewports documentation"
|
|
@@ -10881,7 +10914,10 @@ export default {
|
|
|
10881
10914
|
}`), react_default.createElement("p", null, "Which would look like:"), react_default.createElement(
|
|
10882
10915
|
"img",
|
|
10883
10916
|
{
|
|
10884
|
-
src: api.getDocsUrl({
|
|
10917
|
+
src: api.getDocsUrl({
|
|
10918
|
+
asset: "onboarding/sidebar-with-groups.png",
|
|
10919
|
+
ref: "guide"
|
|
10920
|
+
}),
|
|
10885
10921
|
alt: "Grouped components in the sidebar"
|
|
10886
10922
|
}
|
|
10887
10923
|
), react_default.createElement("strong", null, "Take it further"), react_default.createElement("p", null, "Read the", " ", react_default.createElement(
|
|
@@ -10889,7 +10925,8 @@ export default {
|
|
|
10889
10925
|
{
|
|
10890
10926
|
href: api.getDocsUrl({
|
|
10891
10927
|
subpath: "writing-stories/naming-components-and-hierarchy",
|
|
10892
|
-
renderer: !0
|
|
10928
|
+
renderer: !0,
|
|
10929
|
+
ref: "guide"
|
|
10893
10930
|
}),
|
|
10894
10931
|
target: "_blank"
|
|
10895
10932
|
},
|
|
@@ -10916,8 +10953,8 @@ export default {
|
|
|
10916
10953
|
"img",
|
|
10917
10954
|
{
|
|
10918
10955
|
src: api.getDocsUrl({
|
|
10919
|
-
|
|
10920
|
-
|
|
10956
|
+
asset: "writing-tests/testing-ui-overview.png",
|
|
10957
|
+
ref: "guide"
|
|
10921
10958
|
}),
|
|
10922
10959
|
alt: "Storybook app with story status indicators, testing widget, and addon panel annotated"
|
|
10923
10960
|
}
|
|
@@ -10926,7 +10963,8 @@ export default {
|
|
|
10926
10963
|
{
|
|
10927
10964
|
href: api.getDocsUrl({
|
|
10928
10965
|
subpath: "writing-tests/integrations/vitest-addon",
|
|
10929
|
-
renderer: !0
|
|
10966
|
+
renderer: !0,
|
|
10967
|
+
ref: "guide"
|
|
10930
10968
|
}),
|
|
10931
10969
|
target: "_blank",
|
|
10932
10970
|
withArrow: !0
|
|
@@ -10974,8 +11012,8 @@ export default {
|
|
|
10974
11012
|
"img",
|
|
10975
11013
|
{
|
|
10976
11014
|
src: api.getDocsUrl({
|
|
10977
|
-
|
|
10978
|
-
|
|
11015
|
+
asset: "onboarding/test-widget-with-failures.png",
|
|
11016
|
+
ref: "guide"
|
|
10979
11017
|
}),
|
|
10980
11018
|
alt: "Test widget showing test failures"
|
|
10981
11019
|
}
|
|
@@ -10983,8 +11021,8 @@ export default {
|
|
|
10983
11021
|
"img",
|
|
10984
11022
|
{
|
|
10985
11023
|
src: api.getDocsUrl({
|
|
10986
|
-
|
|
10987
|
-
|
|
11024
|
+
asset: "writing-tests/context-menu.png",
|
|
11025
|
+
ref: "guide"
|
|
10988
11026
|
}),
|
|
10989
11027
|
alt: "Screenshot of story sidebar item with open menu"
|
|
10990
11028
|
}
|
|
@@ -10993,7 +11031,8 @@ export default {
|
|
|
10993
11031
|
{
|
|
10994
11032
|
href: api.getDocsUrl({
|
|
10995
11033
|
subpath: "writing-tests#component-tests",
|
|
10996
|
-
renderer: !0
|
|
11034
|
+
renderer: !0,
|
|
11035
|
+
ref: "guide"
|
|
10997
11036
|
}),
|
|
10998
11037
|
target: "_blank"
|
|
10999
11038
|
},
|
|
@@ -11004,6 +11043,7 @@ export default {
|
|
|
11004
11043
|
id: "writeInteractions",
|
|
11005
11044
|
after: ["renderComponent"],
|
|
11006
11045
|
label: "Test functionality with interactions",
|
|
11046
|
+
available: () => !!globalThis?.FEATURES?.interactions,
|
|
11007
11047
|
criteria: "At least one story with a play or test function",
|
|
11008
11048
|
subscribe: subscribeToIndex(
|
|
11009
11049
|
(entries) => Object.values(entries).some(
|
|
@@ -11047,8 +11087,8 @@ export const Disabled: Story = {
|
|
|
11047
11087
|
"img",
|
|
11048
11088
|
{
|
|
11049
11089
|
src: api.getDocsUrl({
|
|
11050
|
-
|
|
11051
|
-
|
|
11090
|
+
asset: "writing-tests/interaction-test-pass.png",
|
|
11091
|
+
ref: "guide"
|
|
11052
11092
|
}),
|
|
11053
11093
|
alt: "Storybook with a LoginForm component and passing interactions in the Interactions panel"
|
|
11054
11094
|
}
|
|
@@ -11057,7 +11097,8 @@ export const Disabled: Story = {
|
|
|
11057
11097
|
{
|
|
11058
11098
|
href: api.getDocsUrl({
|
|
11059
11099
|
subpath: "writing-tests/interaction-testing",
|
|
11060
|
-
renderer: !0
|
|
11100
|
+
renderer: !0,
|
|
11101
|
+
ref: "guide"
|
|
11061
11102
|
}),
|
|
11062
11103
|
target: "_blank"
|
|
11063
11104
|
},
|
|
@@ -11077,7 +11118,8 @@ export const Disabled: Story = {
|
|
|
11077
11118
|
{
|
|
11078
11119
|
href: api.getDocsUrl({
|
|
11079
11120
|
subpath: "writing-tests/accessibility-testing",
|
|
11080
|
-
renderer: !0
|
|
11121
|
+
renderer: !0,
|
|
11122
|
+
ref: "guide"
|
|
11081
11123
|
}),
|
|
11082
11124
|
target: "_blank",
|
|
11083
11125
|
withArrow: !0
|
|
@@ -11098,8 +11140,8 @@ export const Disabled: Story = {
|
|
|
11098
11140
|
"img",
|
|
11099
11141
|
{
|
|
11100
11142
|
src: api.getDocsUrl({
|
|
11101
|
-
|
|
11102
|
-
|
|
11143
|
+
asset: "writing-tests/test-widget-a11y-enabled.png",
|
|
11144
|
+
ref: "guide"
|
|
11103
11145
|
}),
|
|
11104
11146
|
alt: "Testing widget with accessibility activated"
|
|
11105
11147
|
}
|
|
@@ -11107,8 +11149,8 @@ export const Disabled: Story = {
|
|
|
11107
11149
|
"img",
|
|
11108
11150
|
{
|
|
11109
11151
|
src: api.getDocsUrl({
|
|
11110
|
-
|
|
11111
|
-
|
|
11152
|
+
asset: "writing-tests/addon-a11y-debug-violations.png",
|
|
11153
|
+
ref: "guide"
|
|
11112
11154
|
}),
|
|
11113
11155
|
alt: "Storybook app with accessibility panel open, showing violations and an interactive popover on the violating elements in the preview"
|
|
11114
11156
|
}
|
|
@@ -11117,7 +11159,8 @@ export const Disabled: Story = {
|
|
|
11117
11159
|
{
|
|
11118
11160
|
href: api.getDocsUrl({
|
|
11119
11161
|
subpath: "writing-tests/accessibility-testing",
|
|
11120
|
-
renderer: !0
|
|
11162
|
+
renderer: !0,
|
|
11163
|
+
ref: "guide"
|
|
11121
11164
|
}),
|
|
11122
11165
|
target: "_blank"
|
|
11123
11166
|
},
|
|
@@ -11139,7 +11182,8 @@ export const Disabled: Story = {
|
|
|
11139
11182
|
{
|
|
11140
11183
|
href: api.getDocsUrl({
|
|
11141
11184
|
subpath: "writing-tests/visual-testing",
|
|
11142
|
-
renderer: !0
|
|
11185
|
+
renderer: !0,
|
|
11186
|
+
ref: "guide"
|
|
11143
11187
|
}),
|
|
11144
11188
|
target: "_blank",
|
|
11145
11189
|
withArrow: !0
|
|
@@ -11157,8 +11201,8 @@ export const Disabled: Story = {
|
|
|
11157
11201
|
"img",
|
|
11158
11202
|
{
|
|
11159
11203
|
src: api.getDocsUrl({
|
|
11160
|
-
|
|
11161
|
-
|
|
11204
|
+
asset: "writing-tests/test-widget-expanded-with-vta.png",
|
|
11205
|
+
ref: "guide"
|
|
11162
11206
|
}),
|
|
11163
11207
|
alt: "Expanded testing widget, showing the Visual tests section"
|
|
11164
11208
|
}
|
|
@@ -11166,8 +11210,8 @@ export const Disabled: Story = {
|
|
|
11166
11210
|
"img",
|
|
11167
11211
|
{
|
|
11168
11212
|
src: api.getDocsUrl({
|
|
11169
|
-
|
|
11170
|
-
|
|
11213
|
+
asset: "writing-tests/vta-run-from-panel.png",
|
|
11214
|
+
ref: "guide"
|
|
11171
11215
|
}),
|
|
11172
11216
|
alt: "Visual tests addon panel showing a diff from the baseline"
|
|
11173
11217
|
}
|
|
@@ -11176,7 +11220,8 @@ export const Disabled: Story = {
|
|
|
11176
11220
|
{
|
|
11177
11221
|
href: api.getDocsUrl({
|
|
11178
11222
|
subpath: "writing-tests/visual-testing",
|
|
11179
|
-
renderer: !0
|
|
11223
|
+
renderer: !0,
|
|
11224
|
+
ref: "guide"
|
|
11180
11225
|
}),
|
|
11181
11226
|
target: "_blank"
|
|
11182
11227
|
},
|
|
@@ -11196,8 +11241,8 @@ export const Disabled: Story = {
|
|
|
11196
11241
|
"img",
|
|
11197
11242
|
{
|
|
11198
11243
|
src: api.getDocsUrl({
|
|
11199
|
-
|
|
11200
|
-
|
|
11244
|
+
asset: "writing-tests/test-widget-coverage-summary.png",
|
|
11245
|
+
ref: "guide"
|
|
11201
11246
|
}),
|
|
11202
11247
|
alt: "Test widget with coverage summary"
|
|
11203
11248
|
}
|
|
@@ -11206,7 +11251,8 @@ export const Disabled: Story = {
|
|
|
11206
11251
|
{
|
|
11207
11252
|
href: api.getDocsUrl({
|
|
11208
11253
|
subpath: "writing-tests/test-coverage",
|
|
11209
|
-
renderer: !0
|
|
11254
|
+
renderer: !0,
|
|
11255
|
+
ref: "guide"
|
|
11210
11256
|
}),
|
|
11211
11257
|
target: "_blank"
|
|
11212
11258
|
},
|
|
@@ -11221,8 +11267,8 @@ export const Disabled: Story = {
|
|
|
11221
11267
|
"img",
|
|
11222
11268
|
{
|
|
11223
11269
|
src: api.getDocsUrl({
|
|
11224
|
-
|
|
11225
|
-
|
|
11270
|
+
asset: "writing-tests/test-ci-workflow-pr-status-checks.png",
|
|
11271
|
+
ref: "guide"
|
|
11226
11272
|
}),
|
|
11227
11273
|
alt: 'GitHub pull request status checks, with a failing "UI Tests / test" check'
|
|
11228
11274
|
}
|
|
@@ -11231,7 +11277,8 @@ export const Disabled: Story = {
|
|
|
11231
11277
|
{
|
|
11232
11278
|
href: api.getDocsUrl({
|
|
11233
11279
|
subpath: "writing-tests/in-ci",
|
|
11234
|
-
renderer: !0
|
|
11280
|
+
renderer: !0,
|
|
11281
|
+
ref: "guide"
|
|
11235
11282
|
}),
|
|
11236
11283
|
target: "_blank"
|
|
11237
11284
|
},
|
|
@@ -11257,7 +11304,8 @@ export const Disabled: Story = {
|
|
|
11257
11304
|
{
|
|
11258
11305
|
href: api.getDocsUrl({
|
|
11259
11306
|
subpath: "writing-docs",
|
|
11260
|
-
renderer: !0
|
|
11307
|
+
renderer: !0,
|
|
11308
|
+
ref: "guide"
|
|
11261
11309
|
}),
|
|
11262
11310
|
target: "_blank",
|
|
11263
11311
|
withArrow: !0
|
|
@@ -11284,8 +11332,8 @@ export default {
|
|
|
11284
11332
|
"img",
|
|
11285
11333
|
{
|
|
11286
11334
|
src: api.getDocsUrl({
|
|
11287
|
-
|
|
11288
|
-
|
|
11335
|
+
asset: "writing-docs/autodocs.png",
|
|
11336
|
+
ref: "guide"
|
|
11289
11337
|
}),
|
|
11290
11338
|
alt: "Storybook autodocs page, showing a title, description, primary story, controls table, and additional stories"
|
|
11291
11339
|
}
|
|
@@ -11294,7 +11342,8 @@ export default {
|
|
|
11294
11342
|
{
|
|
11295
11343
|
href: api.getDocsUrl({
|
|
11296
11344
|
subpath: "writing-docs/autodocs",
|
|
11297
|
-
renderer: !0
|
|
11345
|
+
renderer: !0,
|
|
11346
|
+
ref: "guide"
|
|
11298
11347
|
}),
|
|
11299
11348
|
target: "_blank"
|
|
11300
11349
|
},
|
|
@@ -11314,7 +11363,11 @@ export default {
|
|
|
11314
11363
|
content: ({ api }) => react_default.createElement(react_default.Fragment, null, react_default.createElement("p", null, "You can use MDX (markdown + React components) to provide an introduction to your project, document things like design tokens, or go beyond the automatic documentation for your components."), react_default.createElement("p", null, "For a start, create an ", react_default.createElement("code", null, "introduction.mdx"), " file and (using markdown and Storybook's", " ", react_default.createElement(
|
|
11315
11364
|
Link,
|
|
11316
11365
|
{
|
|
11317
|
-
href: api.getDocsUrl({
|
|
11366
|
+
href: api.getDocsUrl({
|
|
11367
|
+
subpath: "writing-docs/doc-blocks",
|
|
11368
|
+
renderer: !0,
|
|
11369
|
+
ref: "guide"
|
|
11370
|
+
}),
|
|
11318
11371
|
target: "_blank"
|
|
11319
11372
|
},
|
|
11320
11373
|
"doc blocks"
|
|
@@ -11341,7 +11394,8 @@ npm install @my/awesome-project
|
|
|
11341
11394
|
{
|
|
11342
11395
|
href: api.getDocsUrl({
|
|
11343
11396
|
subpath: "writing-docs/mdx",
|
|
11344
|
-
renderer: !0
|
|
11397
|
+
renderer: !0,
|
|
11398
|
+
ref: "guide"
|
|
11345
11399
|
}),
|
|
11346
11400
|
target: "_blank"
|
|
11347
11401
|
},
|
|
@@ -11356,8 +11410,8 @@ npm install @my/awesome-project
|
|
|
11356
11410
|
"img",
|
|
11357
11411
|
{
|
|
11358
11412
|
src: api.getDocsUrl({
|
|
11359
|
-
|
|
11360
|
-
|
|
11413
|
+
asset: "sharing/prbadge-publish.png",
|
|
11414
|
+
ref: "guide"
|
|
11361
11415
|
}),
|
|
11362
11416
|
alt: "PR check for publish action"
|
|
11363
11417
|
}
|
|
@@ -11366,7 +11420,8 @@ npm install @my/awesome-project
|
|
|
11366
11420
|
{
|
|
11367
11421
|
href: api.getDocsUrl({
|
|
11368
11422
|
subpath: "sharing/publish-storybook",
|
|
11369
|
-
renderer: !0
|
|
11423
|
+
renderer: !0,
|
|
11424
|
+
ref: "guide"
|
|
11370
11425
|
}),
|
|
11371
11426
|
target: "_blank"
|
|
11372
11427
|
},
|
|
@@ -12037,14 +12092,17 @@ var fadeScaleIn = keyframes`
|
|
|
12037
12092
|
default:
|
|
12038
12093
|
return "Become an expert";
|
|
12039
12094
|
}
|
|
12040
|
-
}, OpenGuideAction = ({
|
|
12095
|
+
}, OpenGuideAction = ({
|
|
12096
|
+
children,
|
|
12097
|
+
afterClick
|
|
12098
|
+
}) => {
|
|
12041
12099
|
let api = useStorybookApi();
|
|
12042
12100
|
return react_default.createElement(
|
|
12043
12101
|
Listbox.Action,
|
|
12044
12102
|
{
|
|
12045
12103
|
ariaLabel: "Open onboarding guide",
|
|
12046
12104
|
onClick: (e2) => {
|
|
12047
|
-
e2.stopPropagation(), api.navigate("/settings/guide");
|
|
12105
|
+
e2.stopPropagation(), api.navigate("/settings/guide"), afterClick?.();
|
|
12048
12106
|
}
|
|
12049
12107
|
},
|
|
12050
12108
|
react_default.createElement(Listbox.Icon, null, react_default.createElement(ListUnorderedIcon, null)),
|
|
@@ -12065,7 +12123,7 @@ var fadeScaleIn = keyframes`
|
|
|
12065
12123
|
);
|
|
12066
12124
|
let timeout = setTimeout(setItems, 2e3, nextItems);
|
|
12067
12125
|
return () => clearTimeout(timeout);
|
|
12068
|
-
}, [nextItems, items]), react_default.createElement(CollapsibleWithMargin, { collapsed: !hasItems || !loaded }, react_default.createElement(HoverCard, { outlineAnimation: "rainbow" }, react_default.createElement(
|
|
12126
|
+
}, [nextItems, items]), react_default.createElement(CollapsibleWithMargin, { collapsed: !hasItems || !loaded }, react_default.createElement(HoverCard, { id: "storybook-checklist-widget", outlineAnimation: "rainbow" }, react_default.createElement(
|
|
12069
12127
|
Collapsible,
|
|
12070
12128
|
{
|
|
12071
12129
|
collapsed: !hasItems,
|
|
@@ -12098,7 +12156,7 @@ var fadeScaleIn = keyframes`
|
|
|
12098
12156
|
{
|
|
12099
12157
|
as: "div",
|
|
12100
12158
|
closeOnOutsideClick: !0,
|
|
12101
|
-
tooltip: ({ onHide }) => react_default.createElement(Listbox, { as: "ul" }, react_default.createElement(Listbox.Item, { as: "li" }, react_default.createElement(OpenGuideAction,
|
|
12159
|
+
tooltip: ({ onHide }) => react_default.createElement(Listbox, { as: "ul" }, react_default.createElement(Listbox.Item, { as: "li" }, react_default.createElement(OpenGuideAction, { afterClick: onHide }, react_default.createElement(Listbox.Text, null, "Open full guide"))), react_default.createElement(Listbox.Item, { as: "li" }, react_default.createElement(
|
|
12102
12160
|
Listbox.Action,
|
|
12103
12161
|
{
|
|
12104
12162
|
ariaLabel: !1,
|
|
@@ -18826,7 +18884,7 @@ var Sections = styled.ol(({ theme }) => ({
|
|
|
18826
18884
|
padding: 0,
|
|
18827
18885
|
"& > li": {
|
|
18828
18886
|
background: theme.background.content,
|
|
18829
|
-
border: `1px solid ${theme.color.border}`,
|
|
18887
|
+
border: `1px solid ${theme.base === "dark" ? theme.color.darker : theme.color.border}`,
|
|
18830
18888
|
borderRadius: 8
|
|
18831
18889
|
}
|
|
18832
18890
|
})), Items = styled.ol(({ theme }) => ({
|
|
@@ -18836,7 +18894,7 @@ var Sections = styled.ol(({ theme }) => ({
|
|
|
18836
18894
|
margin: 0,
|
|
18837
18895
|
padding: 0,
|
|
18838
18896
|
"& > li:not(:last-child)": {
|
|
18839
|
-
boxShadow: `inset 0 -1px 0 ${theme.color.border}`
|
|
18897
|
+
boxShadow: `inset 0 -1px 0 ${theme.base === "dark" ? theme.color.darker : theme.color.border}`
|
|
18840
18898
|
},
|
|
18841
18899
|
"& > li:last-child": {
|
|
18842
18900
|
borderBottomLeftRadius: 7,
|
|
@@ -18932,7 +18990,7 @@ var Sections = styled.ol(({ theme }) => ({
|
|
|
18932
18990
|
paddingLeft: 25,
|
|
18933
18991
|
listStyleType: "disc",
|
|
18934
18992
|
"li::marker": {
|
|
18935
|
-
color: theme.color.
|
|
18993
|
+
color: theme.color.mediumdark
|
|
18936
18994
|
}
|
|
18937
18995
|
}
|
|
18938
18996
|
})), StatusIcon2 = styled.div(({ theme }) => ({
|
|
@@ -18941,9 +18999,9 @@ var Sections = styled.ol(({ theme }) => ({
|
|
|
18941
18999
|
minHeight: 16,
|
|
18942
19000
|
minWidth: 16,
|
|
18943
19001
|
margin: 0,
|
|
18944
|
-
background: theme.background.app,
|
|
19002
|
+
background: theme.base === "dark" ? theme.color.darkest : theme.background.app,
|
|
18945
19003
|
borderRadius: 9,
|
|
18946
|
-
outline: `1px solid ${theme.color.border}`,
|
|
19004
|
+
outline: `1px solid ${theme.base === "dark" ? theme.color.darker : theme.color.border}`,
|
|
18947
19005
|
outlineOffset: -1
|
|
18948
19006
|
})), Checked2 = styled(StatusPassIcon)(
|
|
18949
19007
|
({ theme, "data-visible": visible }) => ({
|
|
@@ -812,17 +812,19 @@ interface SubAPI$1 {
|
|
|
812
812
|
* Returns the URL of the Storybook documentation for the current version.
|
|
813
813
|
*
|
|
814
814
|
* @param options - The options for the documentation URL.
|
|
815
|
-
* @param options.asset -
|
|
815
|
+
* @param options.asset - Like subpath, but links to the docs-assets directory.
|
|
816
816
|
* @param options.subpath - The subpath of the documentation URL.
|
|
817
817
|
* @param options.versioned - Whether to include the versioned path.
|
|
818
818
|
* @param options.renderer - Whether to include the renderer path.
|
|
819
|
+
* @param options.ref - Tracking reference for the docs site. E.g. 'ui', 'error', 'upgrade', etc.
|
|
819
820
|
* @returns {string} The URL of the Storybook Manager documentation.
|
|
820
821
|
*/
|
|
821
822
|
getDocsUrl: (options: {
|
|
822
|
-
asset?:
|
|
823
|
+
asset?: string;
|
|
823
824
|
subpath?: string;
|
|
824
825
|
versioned?: boolean;
|
|
825
826
|
renderer?: boolean;
|
|
827
|
+
ref?: string;
|
|
826
828
|
}) => string;
|
|
827
829
|
/**
|
|
828
830
|
* Checks if an update is available for the Storybook Manager.
|
|
@@ -2329,7 +2329,7 @@ import { global as global8 } from "@storybook/global";
|
|
|
2329
2329
|
import semver from "semver";
|
|
2330
2330
|
|
|
2331
2331
|
// src/manager-api/version.ts
|
|
2332
|
-
var version = "10.1.0-beta.
|
|
2332
|
+
var version = "10.1.0-beta.1";
|
|
2333
2333
|
|
|
2334
2334
|
// src/manager-api/modules/versions.ts
|
|
2335
2335
|
var { VERSIONCHECK } = global8, getVersionCheckData = (0, import_memoizerific2.default)(1)(() => {
|
|
@@ -2361,7 +2361,7 @@ var { VERSIONCHECK } = global8, getVersionCheckData = (0, import_memoizerific2.d
|
|
|
2361
2361
|
return current && semver.prerelease(current.version) && next ? latest && semver.gt(latest.version, next.version) ? latest : next : latest;
|
|
2362
2362
|
},
|
|
2363
2363
|
// TODO: Move this to it's own "info" module later
|
|
2364
|
-
getDocsUrl: ({ asset, subpath, versioned, renderer }) => {
|
|
2364
|
+
getDocsUrl: ({ asset, subpath = asset, versioned, renderer, ref = "ui" }) => {
|
|
2365
2365
|
let {
|
|
2366
2366
|
versions: { latest, current }
|
|
2367
2367
|
} = store2.getState(), url = `https://storybook.js.org/${asset ? "docs-assets" : "docs"}/`;
|
|
@@ -2377,7 +2377,7 @@ var { VERSIONCHECK } = global8, getVersionCheckData = (0, import_memoizerific2.d
|
|
|
2377
2377
|
let rendererName = global8.STORYBOOK_RENDERER;
|
|
2378
2378
|
rendererName && (url += `?renderer=${normalizeRendererName(rendererName)}`);
|
|
2379
2379
|
}
|
|
2380
|
-
return hash && (url += `#${hash}`), url;
|
|
2380
|
+
return ref && (url += `${url.includes("?") ? "&" : "?"}ref=${ref}`), hash && (url += `#${hash}`), url;
|
|
2381
2381
|
},
|
|
2382
2382
|
versionUpdateAvailable: () => {
|
|
2383
2383
|
let latest = api.getLatestVersion(), current = api.getCurrentVersion();
|
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
import
|
|
2
|
-
import
|
|
3
|
-
import
|
|
1
|
+
import CJS_COMPAT_NODE_URL_jdojl2z4eei from 'node:url';
|
|
2
|
+
import CJS_COMPAT_NODE_PATH_jdojl2z4eei from 'node:path';
|
|
3
|
+
import CJS_COMPAT_NODE_MODULE_jdojl2z4eei from "node:module";
|
|
4
4
|
|
|
5
|
-
var __filename =
|
|
6
|
-
var __dirname =
|
|
7
|
-
var require =
|
|
5
|
+
var __filename = CJS_COMPAT_NODE_URL_jdojl2z4eei.fileURLToPath(import.meta.url);
|
|
6
|
+
var __dirname = CJS_COMPAT_NODE_PATH_jdojl2z4eei.dirname(__filename);
|
|
7
|
+
var require = CJS_COMPAT_NODE_MODULE_jdojl2z4eei.createRequire(import.meta.url);
|
|
8
8
|
|
|
9
9
|
// ------------------------------------------------------------
|
|
10
10
|
// end of CJS compatibility banner, injected by Storybook's esbuild configuration
|
|
@@ -16,8 +16,8 @@ import {
|
|
|
16
16
|
join,
|
|
17
17
|
normalize,
|
|
18
18
|
resolve
|
|
19
|
-
} from "../_node-chunks/chunk-
|
|
20
|
-
import "../_node-chunks/chunk-
|
|
19
|
+
} from "../_node-chunks/chunk-WIWWMCEU.js";
|
|
20
|
+
import "../_node-chunks/chunk-2OVULPK3.js";
|
|
21
21
|
|
|
22
22
|
// ../node_modules/@jridgewell/sourcemap-codec/dist/sourcemap-codec.mjs
|
|
23
23
|
var comma = 44, semicolon = 59, chars = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/", intToChar = new Uint8Array(64), charToInt = new Uint8Array(128);
|
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
import
|
|
2
|
-
import
|
|
3
|
-
import
|
|
1
|
+
import CJS_COMPAT_NODE_URL_jdojl2z4eei from 'node:url';
|
|
2
|
+
import CJS_COMPAT_NODE_PATH_jdojl2z4eei from 'node:path';
|
|
3
|
+
import CJS_COMPAT_NODE_MODULE_jdojl2z4eei from "node:module";
|
|
4
4
|
|
|
5
|
-
var __filename =
|
|
6
|
-
var __dirname =
|
|
7
|
-
var require =
|
|
5
|
+
var __filename = CJS_COMPAT_NODE_URL_jdojl2z4eei.fileURLToPath(import.meta.url);
|
|
6
|
+
var __dirname = CJS_COMPAT_NODE_PATH_jdojl2z4eei.dirname(__filename);
|
|
7
|
+
var require = CJS_COMPAT_NODE_MODULE_jdojl2z4eei.createRequire(import.meta.url);
|
|
8
8
|
|
|
9
9
|
// ------------------------------------------------------------
|
|
10
10
|
// end of CJS compatibility banner, injected by Storybook's esbuild configuration
|
|
@@ -22,9 +22,9 @@ import {
|
|
|
22
22
|
once,
|
|
23
23
|
prompt,
|
|
24
24
|
protectUrls
|
|
25
|
-
} from "../_node-chunks/chunk-
|
|
26
|
-
import "../_node-chunks/chunk-
|
|
27
|
-
import "../_node-chunks/chunk-
|
|
25
|
+
} from "../_node-chunks/chunk-RURZIE3W.js";
|
|
26
|
+
import "../_node-chunks/chunk-XGNRK7QB.js";
|
|
27
|
+
import "../_node-chunks/chunk-2OVULPK3.js";
|
|
28
28
|
var export_instance = import_npmlog.default;
|
|
29
29
|
export {
|
|
30
30
|
CLI_COLORS,
|