@@ -47,6 +47,9 @@ export default {
47
47
} ,
48
48
} ;
49
49
50
+ /**
51
+ * The default size for divider is medium.
52
+ */
50
53
export const Default = Template . bind ( { } ) ;
51
54
Default . args = { } ;
52
55
Default . parameters = {
@@ -85,6 +88,7 @@ const AllDividerSizes = (args) => html`
85
88
86
89
/*
87
90
* Stories for the MDX "Docs" only.
91
+ * "storyName" refers to the display name/heading for a component
88
92
*/
89
93
export const Large = Template . bind ( { } ) ;
90
94
Large . tags = [ "docs-only" ] ;
@@ -114,25 +118,11 @@ Small.parameters = {
114
118
} ,
115
119
} ;
116
120
117
- export const StaticWhite = Template . bind ( { } ) ;
118
- StaticWhite . tags = [ "docs-only" ] ;
119
- StaticWhite . args = {
120
- staticColor : "white" ,
121
- } ;
122
- StaticWhite . parameters = {
123
- chromatic : { disableSnapshot : true } ,
124
- } ;
125
-
126
- export const StaticBlack = Template . bind ( { } ) ;
127
- StaticBlack . tags = [ "docs-only" ] ;
128
- StaticBlack . args = {
129
- staticColor : "black" ,
130
- } ;
131
- StaticBlack . parameters = {
132
- chromatic : { disableSnapshot : true } ,
133
- } ;
134
-
121
+ /**
122
+ * When a vertical divider is used inside of a flex container, use `align-self: stretch; height: auto;` on the divider.
123
+ */
135
124
export const VerticalGroup = AllDividerSizes . bind ( { } ) ;
125
+ VerticalGroup . storyName = "Vertical" ;
136
126
VerticalGroup . tags = [ "docs-only" ] ;
137
127
VerticalGroup . args = {
138
128
vertical : true ,
@@ -142,6 +132,7 @@ VerticalGroup.parameters = {
142
132
} ;
143
133
144
134
export const StaticWhiteGroup = AllDividerSizes . bind ( { } ) ;
135
+ StaticWhiteGroup . storyName = "Static white" ;
145
136
StaticWhiteGroup . tags = [ "docs-only" ] ;
146
137
StaticWhiteGroup . args = {
147
138
staticColor : "white" ,
@@ -151,6 +142,7 @@ StaticWhiteGroup.parameters = {
151
142
} ;
152
143
153
144
export const StaticBlackGroup = AllDividerSizes . bind ( { } ) ;
145
+ StaticBlackGroup . storyName = "Static black" ;
154
146
StaticBlackGroup . tags = [ "docs-only" ] ;
155
147
StaticBlackGroup . args = {
156
148
staticColor : "black" ,
0 commit comments