Storybook: Add story for the Warning component

[im3dabasia]

Part of #67165

What?

This PR adds the Storybook stories for the Warning component in the block editor.

Testing Instructions

1. Start Storybook by running npm run storybook:dev
2. Open Storybook at http://localhost:50240/
3. Navigate to "BlockEditor/Warning" in the Storybook sidebar
4. Test the story

Screenshots or screencast

Screen.Recording.2024-12-19.at.2.03.53.PM.mov

[github-actions]

The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the props-bot label.

If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message.

Co-authored-by: im3dabasia <[email protected]>
Co-authored-by: t-hamano <[email protected]>

To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook.

[im3dabasia]

Hey @t-hamano,

Could you please review my PR for adding the story for the Warning component? I used the README.md as a solid reference to create the story.

Looking forward to your feedback!

[t-hamano]

Thanks for the PR!

I think it's important for this component to show how the actions prop and secondaryActions prop are displayed. For example, see the story of the Notice component. For example, you should be able to define multiple stories like this:

export const WithActions = {
	args: {
		...Default.args,
		actions: [
			<Button key="fix-issue" __next40pxDefaultSize variant="primary">
				{ __( 'Fix issue' ) }
			</Button>,
		],
	},
};

export const WithSecondaryActions = {
	args: {
		...Default.args,
		secondaryActions: [
			{ title: __( 'Get help' ) },
			{ title: __( 'Remove block' ) },
		],
	},
};

[im3dabasia]

@t-hamano , Please check again; I have made the requested changes.

Screen.Recording.2024-12-23.at.6.02.57.PM.mov

[t-hamano]

LGTM 👍