From 302fe41854413d0cdfd58b83dbc16865bb70f5a5 Mon Sep 17 00:00:00 2001 From: daniil4udo Date: Thu, 1 Sep 2022 11:41:27 +0400 Subject: [PATCH 1/5] feat(nuxt): add default slot to the NuxtLoadingIndicator --- packages/nuxt/src/app/components/nuxt-loading-indicator.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/nuxt/src/app/components/nuxt-loading-indicator.ts b/packages/nuxt/src/app/components/nuxt-loading-indicator.ts index 391c9ce8911..a872d8c4866 100644 --- a/packages/nuxt/src/app/components/nuxt-loading-indicator.ts +++ b/packages/nuxt/src/app/components/nuxt-loading-indicator.ts @@ -21,7 +21,7 @@ export default defineComponent({ default: 'repeating-linear-gradient(to right,#00dc82 0%,#34cdfe 50%,#0047e1 100%)' } }, - setup (props) { + setup (props, { slots }) { const indicator = useLoadingIndicator({ duration: props.duration, throttle: props.throttle @@ -50,7 +50,7 @@ export default defineComponent({ transition: 'width 0.1s, height 0.4s, opacity 0.4s', zIndex: 999999 } - }) + }, slots.default()) } }) From ebd1520786e0d35765a79513a237d8adbd0f89a2 Mon Sep 17 00:00:00 2001 From: daniil4udo Date: Thu, 1 Sep 2022 11:46:03 +0400 Subject: [PATCH 2/5] docs: update documentation --- docs/content/3.api/2.components/4.nuxt-loading-indicator.md | 3 +++ 1 file changed, 3 insertions(+) diff --git a/docs/content/3.api/2.components/4.nuxt-loading-indicator.md b/docs/content/3.api/2.components/4.nuxt-loading-indicator.md index 517d5602e31..0b33d3e750d 100644 --- a/docs/content/3.api/2.components/4.nuxt-loading-indicator.md +++ b/docs/content/3.api/2.components/4.nuxt-loading-indicator.md @@ -19,6 +19,9 @@ Add `` in your `app.vue` or layouts. :button-link[Open on StackBlitz]{href="https://stackblitz.com/github/nuxt/framework/tree/main/examples/routing/pages?terminal=dev&file=/app.vue" blank} +## Slots +Default slot available + ## Props - **color**: The color of the loading bar. From d3b922658b2a075c15f688144d0bda0c50d35eb0 Mon Sep 17 00:00:00 2001 From: Daniil Chudo Date: Thu, 1 Sep 2022 14:14:27 +0400 Subject: [PATCH 3/5] Update docs/content/3.api/2.components/4.nuxt-loading-indicator.md Co-authored-by: Alexander Lichter --- docs/content/3.api/2.components/4.nuxt-loading-indicator.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/content/3.api/2.components/4.nuxt-loading-indicator.md b/docs/content/3.api/2.components/4.nuxt-loading-indicator.md index 0b33d3e750d..fda1ef8958e 100644 --- a/docs/content/3.api/2.components/4.nuxt-loading-indicator.md +++ b/docs/content/3.api/2.components/4.nuxt-loading-indicator.md @@ -20,7 +20,7 @@ Add `` in your `app.vue` or layouts. :button-link[Open on StackBlitz]{href="https://stackblitz.com/github/nuxt/framework/tree/main/examples/routing/pages?terminal=dev&file=/app.vue" blank} ## Slots -Default slot available +You can pass custom HTML or components through the loading indicator's default slot. ## Props From 96d36f604b5e3adfae57177aa62fda596b9dfe28 Mon Sep 17 00:00:00 2001 From: Daniel Roe Date: Sun, 9 Oct 2022 21:07:09 +0100 Subject: [PATCH 4/5] fix: pass slots through to render function --- packages/nuxt/src/app/components/nuxt-loading-indicator.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/nuxt/src/app/components/nuxt-loading-indicator.ts b/packages/nuxt/src/app/components/nuxt-loading-indicator.ts index a872d8c4866..30cfc82e8be 100644 --- a/packages/nuxt/src/app/components/nuxt-loading-indicator.ts +++ b/packages/nuxt/src/app/components/nuxt-loading-indicator.ts @@ -50,7 +50,7 @@ export default defineComponent({ transition: 'width 0.1s, height 0.4s, opacity 0.4s', zIndex: 999999 } - }, slots.default()) + }, slots) } }) From f7d9354023766dfcd641e157d88003cb77c75aae Mon Sep 17 00:00:00 2001 From: Daniel Roe Date: Sun, 9 Oct 2022 21:07:52 +0100 Subject: [PATCH 5/5] docs: add newline --- docs/content/3.api/2.components/4.nuxt-loading-indicator.md | 1 + 1 file changed, 1 insertion(+) diff --git a/docs/content/3.api/2.components/4.nuxt-loading-indicator.md b/docs/content/3.api/2.components/4.nuxt-loading-indicator.md index dec0b5bfe5a..c95f4491186 100644 --- a/docs/content/3.api/2.components/4.nuxt-loading-indicator.md +++ b/docs/content/3.api/2.components/4.nuxt-loading-indicator.md @@ -20,6 +20,7 @@ Add `` in your `app.vue` or layouts. :button-link[Open on StackBlitz]{href="https://stackblitz.com/github/nuxt/framework/tree/main/examples/routing/pages?terminal=dev&file=/app.vue" blank} ## Slots + You can pass custom HTML or components through the loading indicator's default slot. ## Props