67 lines
1.6 KiB
TypeScript
67 lines
1.6 KiB
TypeScript
// Copyright 2020 Signal Messenger, LLC
|
|
// SPDX-License-Identifier: AGPL-3.0-only
|
|
|
|
import * as React from 'react';
|
|
import { action } from '@storybook/addon-actions';
|
|
import type { Meta } from '@storybook/react';
|
|
import type { Props } from './PanelRow';
|
|
import { PanelRow } from './PanelRow';
|
|
import { ConversationDetailsIcon, IconType } from './ConversationDetailsIcon';
|
|
|
|
export default {
|
|
title: 'Components/Conversation/ConversationDetails/PanelRow',
|
|
argTypes: {},
|
|
args: {
|
|
icon: <ConversationDetailsIcon ariaLabel="timer" icon={IconType.timer} />,
|
|
label: '',
|
|
info: '',
|
|
right: '',
|
|
actions: (
|
|
<ConversationDetailsIcon
|
|
ariaLabel="trash"
|
|
icon={IconType.trash}
|
|
onClick={action('action onClick')}
|
|
/>
|
|
),
|
|
onClick: action('onClick'),
|
|
},
|
|
} satisfies Meta<Props>;
|
|
|
|
export function Basic(args: Props): JSX.Element {
|
|
return <PanelRow {...args} label="this is a panel row" />;
|
|
}
|
|
|
|
export function Simple(args: Props): JSX.Element {
|
|
return (
|
|
<PanelRow
|
|
{...args}
|
|
label="this is a panel row"
|
|
icon="with icon"
|
|
right="side text"
|
|
/>
|
|
);
|
|
}
|
|
|
|
export function Full(args: Props): JSX.Element {
|
|
return (
|
|
<PanelRow
|
|
{...args}
|
|
label="this is a panel row"
|
|
icon="with icon"
|
|
info="this is some info that exists below the main label"
|
|
right="side text"
|
|
actions="with action"
|
|
/>
|
|
);
|
|
}
|
|
|
|
export function Button(args: Props): JSX.Element {
|
|
return (
|
|
<PanelRow
|
|
{...args}
|
|
label="this is a panel row"
|
|
icon="with icon"
|
|
right="side text"
|
|
/>
|
|
);
|
|
}
|