Add storybook entry for Label component (https://github.com/woocommerce/woocommerce-blocks/pull/11682)
This commit is contained in:
parent
845c84be1e
commit
cee80347f3
|
@ -5,9 +5,9 @@ import { Fragment } from '@wordpress/element';
|
|||
import classNames from 'classnames';
|
||||
import type { ReactElement, HTMLProps } from 'react';
|
||||
|
||||
interface LabelProps extends HTMLProps< HTMLElement > {
|
||||
label?: string | undefined;
|
||||
screenReaderLabel?: string | undefined;
|
||||
export interface LabelProps extends HTMLProps< HTMLElement > {
|
||||
label?: string;
|
||||
screenReaderLabel?: string;
|
||||
wrapperElement?: string;
|
||||
wrapperProps?: HTMLProps< HTMLElement >;
|
||||
}
|
||||
|
|
|
@ -0,0 +1,51 @@
|
|||
/**
|
||||
* External dependencies
|
||||
*/
|
||||
import type { StoryFn, Meta } from '@storybook/react';
|
||||
|
||||
/**
|
||||
* Internal dependencies
|
||||
*/
|
||||
import Label, { LabelProps } from '..';
|
||||
|
||||
export default {
|
||||
title: 'External Components/Label',
|
||||
component: Label,
|
||||
argTypes: {
|
||||
label: {
|
||||
control: {
|
||||
type: 'text',
|
||||
},
|
||||
description: 'The label to be displayed.',
|
||||
},
|
||||
screenReaderLabel: {
|
||||
control: {
|
||||
type: 'text',
|
||||
},
|
||||
description: 'The label to be read by screen readers.',
|
||||
},
|
||||
wrapperElement: {
|
||||
control: {
|
||||
type: 'text',
|
||||
},
|
||||
description:
|
||||
'HTML element to wrap around the label component (e.g. "span").',
|
||||
},
|
||||
wrapperProps: {
|
||||
control: {
|
||||
type: 'object',
|
||||
},
|
||||
description: 'The props to be passed to the wrapper element.',
|
||||
},
|
||||
},
|
||||
} as Meta< LabelProps >;
|
||||
|
||||
const Template: StoryFn = ( args ) => <Label { ...args } />;
|
||||
|
||||
export const Default = Template.bind( {} );
|
||||
Default.args = {
|
||||
label: 'I am a label',
|
||||
screenReaderLabel: 'I am a screen reader label',
|
||||
wrapperElement: 'span',
|
||||
wrapperProps: {},
|
||||
};
|
Loading…
Reference in New Issue