Skip to content

Commit

Permalink
[Storybook] Add Playground stories for components with letter H (#7553)
Browse files Browse the repository at this point in the history
  • Loading branch information
mgadewoll authored Mar 7, 2024
1 parent 415971d commit 75d7e94
Show file tree
Hide file tree
Showing 6 changed files with 211 additions and 0 deletions.
Original file line number Diff line number Diff line change
@@ -0,0 +1,47 @@
/*
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
* or more contributor license agreements. Licensed under the Elastic License
* 2.0 and the Server Side Public License, v 1; you may not use this file except
* in compliance with, at your election, the Elastic License 2.0 or the Server
* Side Public License, v 1.
*/

import type { Meta, StoryObj } from '@storybook/react';

import { EuiBreadcrumbsProps } from '../../breadcrumbs';
import { EuiHeaderBreadcrumbs } from './header_breadcrumbs';

const meta: Meta<EuiBreadcrumbsProps> = {
title: 'EuiHeaderBreadcrumbs',
component: EuiHeaderBreadcrumbs,
args: {
// Component defaults
type: 'application',
max: 4,
truncate: true,
responsive: { xs: 1, s: 2, m: 4 },
lastBreadcrumbIsCurrentPage: true,
},
};

export default meta;
type Story = StoryObj<EuiBreadcrumbsProps>;

export const Playground: Story = {
args: {
breadcrumbs: [
{
text: 'Breadcrumb 1',
href: '#',
},
{
text: 'Breadcrumb 2',
href: '#',
},
{
text: 'Current',
href: '#',
},
],
},
};
31 changes: 31 additions & 0 deletions src/components/header/header_links/header_link.stories.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,31 @@
/*
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
* or more contributor license agreements. Licensed under the Elastic License
* 2.0 and the Server Side Public License, v 1; you may not use this file except
* in compliance with, at your election, the Elastic License 2.0 or the Server
* Side Public License, v 1.
*/

import type { Meta, StoryObj } from '@storybook/react';

import { disableStorybookControls } from '../../../../.storybook/utils';
import { EuiHeaderLink, EuiHeaderLinkProps } from './header_link';

const meta: Meta<EuiHeaderLinkProps> = {
title: 'EuiHeaderLink',
component: EuiHeaderLink,
// Component defaults
args: {
isActive: false,
},
};

export default meta;
type Story = StoryObj<EuiHeaderLinkProps>;

export const Playground: Story = {
argTypes: disableStorybookControls(['buttonRef']),
args: {
children: 'Header link',
},
};
35 changes: 35 additions & 0 deletions src/components/health/health.stories.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,35 @@
/*
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
* or more contributor license agreements. Licensed under the Elastic License
* 2.0 and the Server Side Public License, v 1; you may not use this file except
* in compliance with, at your election, the Elastic License 2.0 or the Server
* Side Public License, v 1.
*/

import type { Meta, StoryObj } from '@storybook/react';

import { hideStorybookControls } from '../../../.storybook/utils';
import { EuiHealth, EuiHealthProps } from './health';

const meta: Meta<EuiHealthProps> = {
title: 'EuiHealth',
component: EuiHealth,
argTypes: {
color: { control: 'text' },
},
// Component defaults
args: {
textSize: 's',
},
};

export default meta;
type Story = StoryObj<EuiHealthProps>;

export const Playground: Story = {
argTypes: hideStorybookControls(['aria-label']),
args: {
children: 'Status',
color: 'success',
},
};
41 changes: 41 additions & 0 deletions src/components/highlight/highlight.stories.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,41 @@
/*
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
* or more contributor license agreements. Licensed under the Elastic License
* 2.0 and the Server Side Public License, v 1; you may not use this file except
* in compliance with, at your election, the Elastic License 2.0 or the Server
* Side Public License, v 1.
*/

import type { Meta, StoryObj } from '@storybook/react';

import { EuiHighlight, EuiHighlightProps } from './highlight';

const meta: Meta<EuiHighlightProps> = {
title: 'EuiHighlight',
component: EuiHighlight,
argTypes: {},
// Component defaults
args: {
strict: false,
highlightAll: false,
hasScreenReaderHelpText: true,
},
};

export default meta;
type Story = StoryObj<EuiHighlightProps>;

export const Playground: Story = {
args: {
children: 'The quick brown fox jumped over the lazy dog.',
search: 'Quick',
},
};

export const MultipleSearchStrings: Story = {
args: {
children: 'The quick brown fox jumped over the lazy dog.',
search: ['Fox', 'Dog'],
highlightAll: true,
},
};
30 changes: 30 additions & 0 deletions src/components/horizontal_rule/horizontal_rule.stories.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,30 @@
/*
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
* or more contributor license agreements. Licensed under the Elastic License
* 2.0 and the Server Side Public License, v 1; you may not use this file except
* in compliance with, at your election, the Elastic License 2.0 or the Server
* Side Public License, v 1.
*/

import type { Meta, StoryObj } from '@storybook/react';

import { hideStorybookControls } from '../../../.storybook/utils';
import { EuiHorizontalRule, EuiHorizontalRuleProps } from './horizontal_rule';

const meta: Meta<EuiHorizontalRuleProps> = {
title: 'EuiHorizontalRule',
component: EuiHorizontalRule,
argTypes: {},
// Component defaults
args: {
size: 'full',
margin: 'l',
},
};

export default meta;
type Story = StoryObj<EuiHorizontalRuleProps>;

export const Playground: Story = {
argTypes: hideStorybookControls(['aria-label']),
};
27 changes: 27 additions & 0 deletions src/components/responsive/hide_for.stories.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
/*
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
* or more contributor license agreements. Licensed under the Elastic License
* 2.0 and the Server Side Public License, v 1; you may not use this file except
* in compliance with, at your election, the Elastic License 2.0 or the Server
* Side Public License, v 1.
*/

import type { Meta, StoryObj } from '@storybook/react';

import { EuiHideFor, EuiHideForProps } from './hide_for';

const meta: Meta<EuiHideForProps> = {
title: 'EuiHideFor',
component: EuiHideFor,
};

export default meta;
type Story = StoryObj<EuiHideForProps>;

export const Playground: Story = {
args: {
sizes: ['xs'],
children:
'Try changing the Storybook viewport, or adding the `l` size, to see how it affects the visibility of this text.',
},
};

0 comments on commit 75d7e94

Please sign in to comment.