mirror of
https://github.com/bitwarden/browser
synced 2025-12-20 10:13:31 +00:00
[CL-208][CL-339] Enhance Storybook docs pages (#14838)
* 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
This commit is contained in:
@@ -1,5 +1,7 @@
|
||||
import { Meta, StoryObj } from "@storybook/angular";
|
||||
|
||||
import { formatArgsForCodeSnippet } from "../../../../.storybook/format-args-for-code-snippet";
|
||||
|
||||
import { ProgressComponent } from "./progress.component";
|
||||
|
||||
export default {
|
||||
@@ -20,19 +22,34 @@ export default {
|
||||
|
||||
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...",
|
||||
|
||||
Reference in New Issue
Block a user