Grafana UI: FilterPill.story.tsx - Replace HorizontalGroup with Stack (#85736)

This commit is contained in:
Laura Fernández 2024-04-08 17:21:58 +02:00 committed by GitHub
parent ccd13bf08e
commit 0e12f60ee6
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 3 additions and 6 deletions

View File

@ -820,9 +820,6 @@ exports[`better eslint`] = {
"packages/grafana-ui/src/components/Dropdown/Dropdown.story.tsx:5381": [ "packages/grafana-ui/src/components/Dropdown/Dropdown.story.tsx:5381": [
[0, 0, 0, "\'VerticalGroup\' import from \'../Layout/Layout\' is restricted from being used by a pattern. Use Stack component instead.", "0"] [0, 0, 0, "\'VerticalGroup\' import from \'../Layout/Layout\' is restricted from being used by a pattern. Use Stack component instead.", "0"]
], ],
"packages/grafana-ui/src/components/FilterPill/FilterPill.story.tsx:5381": [
[0, 0, 0, "\'HorizontalGroup\' import from \'../Layout/Layout\' is restricted from being used by a pattern. Use Stack component instead.", "0"]
],
"packages/grafana-ui/src/components/Forms/Checkbox.story.tsx:5381": [ "packages/grafana-ui/src/components/Forms/Checkbox.story.tsx:5381": [
[0, 0, 0, "\'VerticalGroup\' import from \'../Layout/Layout\' is restricted from being used by a pattern. Use Stack component instead.", "0"] [0, 0, 0, "\'VerticalGroup\' import from \'../Layout/Layout\' is restricted from being used by a pattern. Use Stack component instead.", "0"]
], ],

View File

@ -2,7 +2,7 @@ import { Meta, StoryFn } from '@storybook/react';
import React, { useState } from 'react'; import React, { useState } from 'react';
import { getAvailableIcons } from '../../types'; import { getAvailableIcons } from '../../types';
import { HorizontalGroup } from '../Layout/Layout'; import { Stack } from '../Layout/Stack/Stack';
import { FilterPill } from './FilterPill'; import { FilterPill } from './FilterPill';
import mdx from './FilterPill.mdx'; import mdx from './FilterPill.mdx';
@ -30,11 +30,11 @@ export const Example = () => {
const elements = ['Singapore', 'Paris', 'Stockholm', 'New York', 'London']; const elements = ['Singapore', 'Paris', 'Stockholm', 'New York', 'London'];
return ( return (
<HorizontalGroup> <Stack>
{elements.map((item) => ( {elements.map((item) => (
<FilterPill key={item} label={item} selected={item === selected} onClick={() => setSelected(item)} /> <FilterPill key={item} label={item} selected={item === selected} onClick={() => setSelected(item)} />
))} ))}
</HorizontalGroup> </Stack>
); );
}; };