mirror of
https://github.com/bitwarden/browser
synced 2025-12-20 02:03:39 +00:00
5eb8d7b181
* rearrange button docs * Enhance avatar docs * Enhance badge docs * Enhance banner docs * add util to format args for snippets * update banner snippets * WIP * bind boolean args so they work correctly in Storybook * simplify button stories * Update callout docs * use title component for checkbox docs * use title and description component for chip select docs * update color password story docs * update disclosure docs * add import to icon docs * updated icon-button docs * update link docs * Update prgress docs * updated search field docs * remove html type definitions * add import for progress * updated toast docs * remove example from docs. format args for snippet * Update badges docs * handle array arg values correctly * Update badges list docs * fix dupe key error from taost story * remove unnecessary typeof check * remove banner usage example * add breadcrumbs import statement and jsdoc * add color password import statement * fixing type mismaches * fix typos * Add missing generics to format function * fix typo * update callout icon spacing to match Figma * add back max width container
58 lines
1.1 KiB
TypeScript
58 lines
1.1 KiB
TypeScript
import { Meta, StoryObj } from "@storybook/angular";
|
|
|
|
import { formatArgsForCodeSnippet } from "../../../../.storybook/format-args-for-code-snippet";
|
|
|
|
import { ProgressComponent } from "./progress.component";
|
|
|
|
export default {
|
|
title: "Component Library/Progress",
|
|
component: ProgressComponent,
|
|
parameters: {
|
|
design: {
|
|
type: "figma",
|
|
url: "https://www.figma.com/design/Zt3YSeb6E6lebAffrNLa0h/Tailwind-Component-Library?node-id=16329-40933&t=b5tDKylm5sWm2yKo-4",
|
|
},
|
|
},
|
|
args: {
|
|
showText: true,
|
|
size: "default",
|
|
bgColor: "primary",
|
|
},
|
|
} as Meta;
|
|
|
|
type Story = StoryObj<ProgressComponent>;
|
|
|
|
export const Base: Story = {
|
|
render: (args) => ({
|
|
props: args,
|
|
template: `
|
|
<bit-progress ${formatArgsForCodeSnippet<ProgressComponent>(args)}></bit-progress>
|
|
`,
|
|
}),
|
|
args: {
|
|
barWidth: 50,
|
|
},
|
|
};
|
|
|
|
export const Empty: Story = {
|
|
...Base,
|
|
args: {
|
|
barWidth: 0,
|
|
},
|
|
};
|
|
|
|
export const Full: Story = {
|
|
...Base,
|
|
args: {
|
|
barWidth: 100,
|
|
},
|
|
};
|
|
|
|
export const CustomText: Story = {
|
|
...Base,
|
|
args: {
|
|
barWidth: 25,
|
|
text: "Loading...",
|
|
},
|
|
};
|