Skip to content

Commit 0df8173

Browse files
maradwan26devadula-nandan
maradwan26
and
devadula-nandan
authored
chore(chromatic): button-set fluid stories (#21977)
Co-authored-by: Nandan Devadula <47176249+devadula-nandan@users.noreply.github.com>
1 parent f28c7f5 commit 0df8173

1 file changed

Lines changed: 123 additions & 1 deletion

File tree

‎packages/react/src/components/ButtonSet/ButtonSet.stories.js‎

Lines changed: 123 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
/**
2-
* Copyright IBM Corp. 2016, 2025
2+
* Copyright IBM Corp. 2016, 2026
33
*
44
* This source code is licensed under the Apache-2.0 license found in the
55
* LICENSE file in the root directory of this source tree.
@@ -131,3 +131,125 @@ Fluid.args = {
131131
fluid: true,
132132
Buttons: 8,
133133
};
134+
135+
// ButtonSet Fluid hidden stories for Chromatic VRT
136+
137+
export const FluidOneWide = {
138+
...Fluid,
139+
args: {
140+
...Fluid.args,
141+
Buttons: 1, // One button
142+
'Container width': 800,
143+
},
144+
tags: ['!dev', '!autodocs'],
145+
};
146+
147+
export const FluidOneWideGhost = {
148+
...Fluid,
149+
args: {
150+
...Fluid.args,
151+
Buttons: 3, // A ghost button
152+
'Container width': 800,
153+
},
154+
tags: ['!dev', '!autodocs'],
155+
};
156+
157+
export const FluidOneNarrow = {
158+
...Fluid,
159+
args: {
160+
...Fluid.args,
161+
Buttons: 1, // One button
162+
'Container width': 280,
163+
},
164+
tags: ['!dev', '!autodocs'],
165+
};
166+
167+
export const FluidTwoWide = {
168+
...Fluid,
169+
args: {
170+
...Fluid.args,
171+
Buttons: 4, // Two buttons
172+
'Container width': 800,
173+
},
174+
tags: ['!dev', '!autodocs'],
175+
};
176+
177+
export const FluidTwoWideGhost = {
178+
...Fluid,
179+
args: {
180+
...Fluid.args,
181+
Buttons: 5, // Two buttons with one ghost
182+
'Container width': 800,
183+
},
184+
tags: ['!dev', '!autodocs'],
185+
};
186+
187+
export const FluidTwoNarrow = {
188+
...Fluid,
189+
args: {
190+
...Fluid.args,
191+
Buttons: 4, // Two buttons
192+
'Container width': 320,
193+
},
194+
tags: ['!dev', '!autodocs'],
195+
};
196+
197+
export const FluidThreeWide = {
198+
...Fluid,
199+
args: {
200+
...Fluid.args,
201+
Buttons: 6, // Three buttons
202+
'Container width': 800,
203+
},
204+
tags: ['!dev', '!autodocs'],
205+
};
206+
207+
export const FluidThreeWideGhost = {
208+
...Fluid,
209+
args: {
210+
...Fluid.args,
211+
Buttons: 7, // Three buttons with one ghost
212+
'Container width': 800,
213+
},
214+
tags: ['!dev', '!autodocs'],
215+
};
216+
217+
export const FluidThreeNarrow = {
218+
...Fluid,
219+
args: {
220+
...Fluid.args,
221+
Buttons: 6, // Three buttons
222+
'Container width': 500,
223+
},
224+
tags: ['!dev', '!autodocs'],
225+
};
226+
227+
export const FluidFourWide = {
228+
...Fluid,
229+
args: {
230+
...Fluid.args,
231+
Buttons: 9, // Four buttons
232+
'Container width': 1000,
233+
},
234+
tags: ['!dev', '!autodocs'],
235+
};
236+
237+
export const FluidFourWideGhost = {
238+
...Fluid,
239+
args: {
240+
...Fluid.args,
241+
Buttons: 10, // Four buttons with one ghost
242+
'Container width': 1000,
243+
},
244+
tags: ['!dev', '!autodocs'],
245+
};
246+
247+
export const FluidFourNarrow = {
248+
...Fluid,
249+
args: {
250+
...Fluid.args,
251+
Buttons: 9, // Four buttons
252+
'Container width': 600,
253+
},
254+
tags: ['!dev', '!autodocs'],
255+
};

0 commit comments

Comments
 (0)