CommunityRule/community-rule
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update and resolve storybook issues

Browse Source
This commit is contained in:
adilallo
2026-02-02 18:56:47 -07:00
parent 1ec9e9d639
commit 9a42035b0c
2 changed files with 24 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.storybook/preview.js
+4
View File
@@ -1,5 +1,7 @@
import "../app/globals.css"; import "../app/globals.css";
import "./fonts.css"; import "./fonts.css";
import { MessagesProvider } from "../app/contexts/MessagesContext";
import messages from "../messages/en/index";
/** @type { import('@storybook/react').Preview } */ /** @type { import('@storybook/react').Preview } */
const preview = { const preview = {
@@ -13,9 +15,11 @@ const preview = {
}, },
decorators: [ decorators: [
(Story) => ( (Story) => (
<MessagesProvider messages={messages}>
<div className="font-inter"> <div className="font-inter">
<Story /> <Story />
</div> </div>
</MessagesProvider>
), ),
], ],
}; };
stories/Progress.stories.js
+17 -13
View File
@@ -39,58 +39,62 @@ export const Default = {
args: { args: {
progress: "3-2", progress: "3-2",
}, },
render: (args) => <Progress {...args} />, render: (args) => (
<div className="w-full max-w-[600px]">
<Progress {...args} />
</div>
),
}; };
export const AllStates = { export const AllStates = {
args: {}, args: {},
render: (_args) => ( render: (_args) => (
<div className="space-y-4 w-full max-w-[600px]"> <div className="space-y-4 w-full max-w-[600px]">
<div> <div className="w-full">
<p className="text-white mb-2">1-0</p> <p className="text-white mb-2">1-0</p>
<Progress {..._args} progress="1-0" /> <Progress {..._args} progress="1-0" />
</div> </div>
<div> <div className="w-full">
<p className="text-white mb-2">1-1</p> <p className="text-white mb-2">1-1</p>
<Progress {..._args} progress="1-1" /> <Progress {..._args} progress="1-1" />
</div> </div>
<div> <div className="w-full">
<p className="text-white mb-2">1-2</p> <p className="text-white mb-2">1-2</p>
<Progress {..._args} progress="1-2" /> <Progress {..._args} progress="1-2" />
</div> </div>
<div> <div className="w-full">
<p className="text-white mb-2">1-3</p> <p className="text-white mb-2">1-3</p>
<Progress {..._args} progress="1-3" /> <Progress {..._args} progress="1-3" />
</div> </div>
<div> <div className="w-full">
<p className="text-white mb-2">1-4</p> <p className="text-white mb-2">1-4</p>
<Progress {..._args} progress="1-4" /> <Progress {..._args} progress="1-4" />
</div> </div>
<div> <div className="w-full">
<p className="text-white mb-2">1-5</p> <p className="text-white mb-2">1-5</p>
<Progress {..._args} progress="1-5" /> <Progress {..._args} progress="1-5" />
</div> </div>
<div> <div className="w-full">
<p className="text-white mb-2">2-0</p> <p className="text-white mb-2">2-0</p>
<Progress {..._args} progress="2-0" /> <Progress {..._args} progress="2-0" />
</div> </div>
<div> <div className="w-full">
<p className="text-white mb-2">2-1</p> <p className="text-white mb-2">2-1</p>
<Progress {..._args} progress="2-1" /> <Progress {..._args} progress="2-1" />
</div> </div>
<div> <div className="w-full">
<p className="text-white mb-2">2-2</p> <p className="text-white mb-2">2-2</p>
<Progress {..._args} progress="2-2" /> <Progress {..._args} progress="2-2" />
</div> </div>
<div> <div className="w-full">
<p className="text-white mb-2">3-0</p> <p className="text-white mb-2">3-0</p>
<Progress {..._args} progress="3-0" /> <Progress {..._args} progress="3-0" />
</div> </div>
<div> <div className="w-full">
<p className="text-white mb-2">3-1</p> <p className="text-white mb-2">3-1</p>
<Progress {..._args} progress="3-1" /> <Progress {..._args} progress="3-1" />
</div> </div>
<div> <div className="w-full">
<p className="text-white mb-2">3-2</p> <p className="text-white mb-2">3-2</p>
<Progress {..._args} progress="3-2" /> <Progress {..._args} progress="3-2" />
</div> </div>