diff --git a/src/Breadcrumb/Breadcrumb.Skeleton.svelte b/src/Breadcrumb/Breadcrumb.Skeleton.svelte index c40197b1..ba7c2d72 100644 --- a/src/Breadcrumb/Breadcrumb.Skeleton.svelte +++ b/src/Breadcrumb/Breadcrumb.Skeleton.svelte @@ -1,12 +1,27 @@ + +
- {#each [0, 1, 2] as item, i (item)} + {#each Array.from({ length: count }, (_, i) => i) as item, i (item)}
 
diff --git a/src/Breadcrumb/Breadcrumb.Story.svelte b/src/Breadcrumb/Breadcrumb.Story.svelte index c42ecf85..ae7ca3f2 100644 --- a/src/Breadcrumb/Breadcrumb.Story.svelte +++ b/src/Breadcrumb/Breadcrumb.Story.svelte @@ -24,7 +24,7 @@ Breadcrumb 3 {:else if story === 'skeleton'} - + {:else} diff --git a/src/Breadcrumb/Breadcrumb.stories.js b/src/Breadcrumb/Breadcrumb.stories.js index 44e80de0..6baf69e3 100644 --- a/src/Breadcrumb/Breadcrumb.stories.js +++ b/src/Breadcrumb/Breadcrumb.stories.js @@ -1,4 +1,4 @@ -import { withKnobs, boolean } from "@storybook/addon-knobs"; +import { withKnobs, boolean, number } from "@storybook/addon-knobs"; import Component from "./Breadcrumb.Story.svelte"; export default { title: "Breadcrumb", decorators: [withKnobs] }; @@ -12,7 +12,11 @@ export const Default = () => ({ export const Skeleton = () => ({ Component, - props: { story: "skeleton" }, + props: { + story: "skeleton", + noTrailingSlash: boolean("No Trailing Slash (noTrailingSlash)", false), + count: number("Number of breadcrumb items (count)", 3), + }, }); export const CurrentPage = () => ({