fix: add missing React key props to ButtonGroup and FloatingButtonGro… (#18615)

Fix missing React key props on ButtonGroup and FloatingButtonGroup story
children
                  
JSX element arrays defined in Storybook args require explicit key props,
otherwise React emits a "missing key" warning in development. This adds
keys to the children arrays in ButtonGroup.stories.tsx and
FloatingButtonGroup.stories.tsx.
This commit is contained in:
williamjusticedavis
2026-03-13 18:19:30 +02:00
committed by GitHub
parent 1b1d79b08f
commit 3054679411
2 changed files with 12 additions and 12 deletions
@@ -27,9 +27,9 @@ export const Default: Story = {
variant: 'primary',
accent: 'danger',
children: [
<Button Icon={IconNotes} title="Note" />,
<Button Icon={IconCheckbox} title="Task" />,
<Button Icon={IconTimelineEvent} title="Activity" />,
<Button key="note" Icon={IconNotes} title="Note" />,
<Button key="task" Icon={IconCheckbox} title="Task" />,
<Button key="activity" Icon={IconTimelineEvent} title="Activity" />,
],
},
argTypes: {
@@ -41,9 +41,9 @@ export const Default: Story = {
export const Catalog: CatalogStory<Story, typeof ButtonGroup> = {
args: {
children: [
<Button Icon={IconNotes} title="Note" />,
<Button Icon={IconCheckbox} title="Task" />,
<Button Icon={IconTimelineEvent} title="Activity" />,
<Button key="note" Icon={IconNotes} title="Note" />,
<Button key="task" Icon={IconCheckbox} title="Task" />,
<Button key="activity" Icon={IconTimelineEvent} title="Activity" />,
],
},
argTypes: {
@@ -20,9 +20,9 @@ export const Default: Story = {
args: {
size: 'small',
children: [
<FloatingButton Icon={IconNotes} />,
<FloatingButton Icon={IconCheckbox} />,
<FloatingButton Icon={IconTimelineEvent} />,
<FloatingButton key="notes" Icon={IconNotes} />,
<FloatingButton key="checkbox" Icon={IconCheckbox} />,
<FloatingButton key="timeline" Icon={IconTimelineEvent} />,
],
},
argTypes: {
@@ -34,9 +34,9 @@ export const Default: Story = {
export const Catalog: CatalogStory<Story, typeof FloatingButtonGroup> = {
args: {
children: [
<FloatingButton Icon={IconNotes} />,
<FloatingButton Icon={IconCheckbox} />,
<FloatingButton Icon={IconTimelineEvent} />,
<FloatingButton key="notes" Icon={IconNotes} />,
<FloatingButton key="checkbox" Icon={IconCheckbox} />,
<FloatingButton key="timeline" Icon={IconTimelineEvent} />,
],
},
argTypes: {