Skip to content

Commit

Permalink
fix: [MDS-512] Storybook naming (#156)
Browse files Browse the repository at this point in the history
  • Loading branch information
GittHub-d authored Apr 27, 2023
1 parent 0c2ce76 commit 6dc9cbd
Show file tree
Hide file tree
Showing 18 changed files with 209 additions and 182 deletions.
57 changes: 32 additions & 25 deletions example/lib/src/storybook/stories/accordion.dart
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@ class AccordionStory extends Story {
builder: (context) {
final accordionSizesKnob = context.knobs.nullable.options(
label: "accordionSize",
description: "Accordion size variants.",
description: "Size variants for MoonAccordion.",
enabled: false,
initial: MoonAccordionItemSize.md,
options: const [
Expand All @@ -28,96 +28,103 @@ class AccordionStory extends Story {

final textColorsKnob = context.knobs.nullable.options(
label: "textColor",
description: "MoonColors variants for Accordion text.",
description: "MoonColors variants for MoonAccordion text.",
enabled: false,
initial: 0, // piccolo
initial: 0,
// piccolo
options: colorOptions,
);

final textColor = colorTable(context)[textColorsKnob ?? 40];

final iconColorsKnob = context.knobs.nullable.options(
label: "iconColor",
description: "MoonColors variants for Accordion trailing icon.",
description: "MoonColors variants for MoonAccordion trailing icon.",
enabled: false,
initial: 0, // piccolo
initial: 0,
// piccolo
options: colorOptions,
);

final iconColor = colorTable(context)[iconColorsKnob ?? 40];

final expandedIconColorsKnob = context.knobs.nullable.options(
label: "expandedIconColor",
description: "MoonColors variants for expanded Accordion trailing icon.",
description: "MoonColors variants for expanded MoonAccordion trailing icon.",
enabled: false,
initial: 0, // piccolo
initial: 0,
// piccolo
options: colorOptions,
);

final expandedIconColor = colorTable(context)[expandedIconColorsKnob ?? 40];

final backgroundColorsKnob = context.knobs.nullable.options(
label: "backgroundColor",
description: "MoonColors variants for Accordion background.",
description: "MoonColors variants for MoonAccordion background.",
enabled: false,
initial: 0, // piccolo
initial: 0,
// piccolo
options: colorOptions,
);

final backgroundColor = colorTable(context)[backgroundColorsKnob ?? 40];

final expandedBackgroundColorsKnob = context.knobs.nullable.options(
label: "expandedBackgroundColor",
description: "MoonColors variants for expanded Accordion background.",
description: "MoonColors variants for expanded MoonAccordion background.",
enabled: false,
initial: 0, // piccolo
initial: 0,
// piccolo
options: colorOptions,
);

final expandedBackgroundColor = colorTable(context)[expandedBackgroundColorsKnob ?? 40];

final borderColorsKnob = context.knobs.nullable.options(
label: "borderColor",
description: "MoonColors variants for Accordion border.",
description: "MoonColors variants for MoonAccordion border.",
enabled: false,
initial: 0, // piccolo
initial: 0,
// piccolo
options: colorOptions,
);

final borderColor = colorTable(context)[borderColorsKnob ?? 40];

final dividerColorsKnob = context.knobs.nullable.options(
label: "dividerColor",
description: "MoonColors variants for expanded Accordion divider.",
description: "MoonColors variants for expanded MoonAccordion divider.",
enabled: false,
initial: 0, // piccolo
initial: 0,
// piccolo
options: colorOptions,
);

final dividerColor = colorTable(context)[dividerColorsKnob ?? 40];

final borderRadiusKnob = context.knobs.nullable.sliderInt(
label: "borderRadius",
description: "Border radius for Accordion.",
description: "Border radius for MoonAccordion.",
enabled: false,
initial: 8,
max: 32,
);

final showBorderKnob = context.knobs.boolean(
label: "showBorder",
description: "Show border around the Accordion.",
description: "Show border around MoonAccordion.",
);

final showDividerKnob = context.knobs.boolean(
label: "showDivider",
description: "Show divider between Accordion header and body.",
description: "Show divider between MoonAccordion header and body.",
initial: true,
);

final showShadowKnob = context.knobs.boolean(
label: "Show shadows",
description: "Show shadows under the Accordion.",
description: "Show shadows under MoonAccordion.",
initial: true,
);

Expand All @@ -127,7 +134,7 @@ class AccordionStory extends Story {
clipBehavior: Clip.none,
children: [
const SizedBox(height: 64),
const TextDivider(text: "Grouped accordion"),
const TextDivider(text: "Grouped MoonAccordion"),
const SizedBox(height: 32),
MoonAccordionItem<AccordionItems>(
identityValue: AccordionItems.first,
Expand All @@ -148,7 +155,7 @@ class AccordionStory extends Story {
childrenPadding: const EdgeInsets.all(12),
onExpansionChanged: (value) => setState(() => currentlyOpenAccordionItem = value),
leading: const Icon(MoonIcons.frame_24),
title: const Text("Grouped accordion item #1"),
title: const Text("Grouped MoonAccordion item #1"),
children: const [
Text(
"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.",
Expand Down Expand Up @@ -176,15 +183,15 @@ class AccordionStory extends Story {
childrenPadding: const EdgeInsets.all(12),
onExpansionChanged: (value) => setState(() => currentlyOpenAccordionItem = value),
leading: const Icon(MoonIcons.frame_24),
title: const Text("Grouped accordion item #2"),
title: const Text("Grouped MoonAccordion item #2"),
children: const [
Text(
"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.",
),
],
),
const SizedBox(height: 40),
const TextDivider(text: "Ungrouped accordion with content outside"),
const TextDivider(text: "Ungrouped MoonAccordion with content outside"),
const SizedBox(height: 32),
MoonAccordionItem<AccordionItems>(
accordionSize: accordionSizesKnob,
Expand All @@ -201,7 +208,7 @@ class AccordionStory extends Story {
showBorder: showBorderKnob,
shadows: showShadowKnob == true ? null : [],
childrenPadding: const EdgeInsets.symmetric(vertical: 12),
title: const Text("Ungrouped accordion item #1"),
title: const Text("Ungrouped MoonAccordion item #1"),
children: const [
Text(
"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.",
Expand All @@ -224,7 +231,7 @@ class AccordionStory extends Story {
showBorder: showBorderKnob,
shadows: showShadowKnob == true ? null : [],
childrenPadding: const EdgeInsets.symmetric(vertical: 12),
title: const Text("Ungrouped accordion item #2"),
title: const Text("Ungrouped MoonAccordion item #2"),
children: const [
Text(
"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.",
Expand Down
Loading

0 comments on commit 6dc9cbd

Please sign in to comment.