mirror of
https://github.com/bitwarden/browser
synced 2025-12-06 00:13:28 +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
34 lines
1.2 KiB
TypeScript
34 lines
1.2 KiB
TypeScript
import { argsToTemplate, StoryObj } from "@storybook/angular";
|
|
|
|
type RenderArgType<T> = StoryObj<T>["args"];
|
|
|
|
export const formatArgsForCodeSnippet = <ComponentType extends Record<string, any>>(
|
|
args: RenderArgType<ComponentType>,
|
|
) => {
|
|
const nonNullArgs = Object.entries(args as ComponentType).filter(
|
|
([_, value]) => value !== null && value !== undefined,
|
|
);
|
|
const functionArgs = nonNullArgs.filter(([_, value]) => typeof value === "function");
|
|
const argsToFormat = nonNullArgs.filter(([_, value]) => typeof value !== "function");
|
|
|
|
const argsToTemplateIncludeKeys = [...functionArgs].map(
|
|
([key, _]) => key as keyof RenderArgType<ComponentType>,
|
|
);
|
|
|
|
const formattedNonFunctionArgs = argsToFormat
|
|
.map(([key, value]) => {
|
|
if (typeof value === "boolean") {
|
|
return `[${key}]="${value}"`;
|
|
}
|
|
|
|
if (Array.isArray(value)) {
|
|
const formattedArray = value.map((v) => `'${v}'`).join(", ");
|
|
return `[${key}]="[${formattedArray}]"`;
|
|
}
|
|
return `${key}="${value}"`;
|
|
})
|
|
.join(" ");
|
|
|
|
return `${formattedNonFunctionArgs} ${argsToTemplate(args as ComponentType, { include: argsToTemplateIncludeKeys })}`;
|
|
};
|