bitwarden-estensione-browser/libs/components/src/typography/typography.stories.ts

91 lines
1.4 KiB
TypeScript

import { Meta, StoryObj } from "@storybook/angular";
import { TypographyDirective } from "./typography.directive";
export default {
title: "Component Library/Typography",
component: TypographyDirective,
args: {
bitTypography: "body1",
},
} as Meta;
type Story = StoryObj<TypographyDirective & { text: string }>;
export const H1: Story = {
render: (args) => ({
props: args,
template: `<span [bitTypography]="bitTypography" class="tw-text-main">{{text}}</span>`,
}),
args: {
bitTypography: "h1",
text: "h1. Page Title",
},
};
export const H2: Story = {
...H1,
args: {
bitTypography: "h2",
text: "h2. Page Section",
},
};
export const H3: Story = {
...H1,
args: {
bitTypography: "h3",
text: "h3. Page Section",
},
};
export const H4: Story = {
...H1,
args: {
bitTypography: "h4",
text: "h4. Page Section",
},
};
export const H5: Story = {
...H1,
args: {
bitTypography: "h5",
text: "h5. Page Section",
},
};
export const H6: Story = {
...H1,
args: {
bitTypography: "h6",
text: "h6. Page Section",
},
};
export const Body1: Story = {
...H1,
args: {
bitTypography: "body1",
text: "Body 1",
},
};
export const Body2: Story = {
...H1,
args: {
bitTypography: "body2",
text: "Body 2",
},
};
export const Helper: Story = {
...H1,
args: {
bitTypography: "helper",
text: "Helper Text",
},
};