\r\n ...\r\n````\r\n\r\nAdd some page with some async load time so to have the loading indicator show between route change.\n\n### Describe the bug\n\nThe browser view transition diffing makes the NuxtLoadingIndicator invisible up until the page is fully loaded when it shortly flashes to a 100%. If I remove the `viewTransition: true` it works as expected again.\n\n### Additional context\n\n_No response_\n\n### Logs\n\n_No response_",[3032,3035,3038],{"name":3033,"color":3034},"good first issue","fbca04",{"name":3036,"color":3037},"bug","d73a4a",{"name":3039,"color":3040},"馃敤 p3-minor","FBCA04",21280,"NuxtLoadingIndicator is broken when using together with experimental.viewTransitions ","2024-11-19T16:20:26Z","https://github.com/nuxt/nuxt/issues/21280",0.68400955,{"labels":3047,"number":3051,"owner":3023,"repository":3023,"state":3052,"title":3053,"updated_at":3054,"url":3055,"score":3056},[3048],{"name":3049,"color":3050},"2.x","d4c5f9",7568,"closed","Unable to customize loading indicator","2023-01-18T15:34:24Z","https://github.com/nuxt/nuxt/issues/7568",0.6364091,{"description":3058,"labels":3059,"number":3064,"owner":3023,"repository":3023,"state":3052,"title":3065,"updated_at":3066,"url":3067,"score":3068},"### Describe the feature\n\nI want to use a utility-based CSS framework (e.g. Tailwind) to manage colors and I want to override the loading indicator default colors, but they are highly detailed at the inline style level.\r\n\r\nI tried `important`, but it doesn't work, probably because of the difference in `background` and `background-color`.\r\n```vue\r\n\u003Ctemplate>\r\n \u003CNuxtLoadingIndicator :throttle=\"0\" :height=\"2\" class=\"!bg-orange\" />\r\n\u003C/template>\r\n```\r\n\r\nTherefore, we need a way to disable the `color` option.\r\n\r\nThe next snippet is what I want to do\r\n```vue\r\n\u003Ctemplate>\r\n \u003CNuxtLoadingIndicator :throttle=\"0\" :height=\"2\" class=\"bg-orange\" />\r\n\u003C/template>\r\n```\r\n\r\n\r\n\n\n### Additional information\n\n- [ ] Would you be willing to help implement this feature?\n- [ ] Could this feature be implemented as a module?\n\n### Final checks\n\n- [X] Read the [contribution guide](https://v3.nuxtjs.org/community/contribution).\n- [X] Check existing [discussions](https://github.com/nuxt/framework/discussions) and [issues](https://github.com/nuxt/framework/issues).",[3060,3063],{"name":3061,"color":3062},"3.x","29bc7f",{"name":3020,"color":3021},12407,"`\u003CNuxtLoadingIndicator>` without default color","2025-01-19T16:12:32Z","https://github.com/nuxt/nuxt/issues/12407",0.64018434,{"description":3070,"labels":3071,"number":3078,"owner":3023,"repository":3023,"state":3052,"title":3079,"updated_at":3080,"url":3081,"score":3082},"### Environment\r\n\r\n```bash\r\nNuxt project info: 0:30:28\r\n\r\n------------------------------\r\n- Operating System: Windows_NT\r\n- Node Version: v20.10.0\r\n- Nuxt Version: 3.11.1\r\n- CLI Version: 3.11.1\r\n- Nitro Version: 2.9.4\r\n- Package Manager: pnpm@8.15.4\r\n- Builder: -\r\n- User Config: typescript, modules, app, features, experimental, css, postcss, recaptcha, pwa, devtools, vite\r\n- Runtime Modules: @unocss/nuxt@0.58.6, @nuxtjs/i18n@8.1.1, @vueuse/nuxt@10.9.0, @vite-pwa/nuxt@0.6.0\r\n- Build Modules: -\r\n------------------------------\r\n```\r\n\r\n### Reproduction\r\n\r\nhttps://stackblitz.com/edit/github-lpzonl?file=app.vue,styles%2Fglobal.css,nuxt.config.ts\r\n\r\n### Describe the bug\r\n\r\nThere is no way to change `hideDelay` from the loading indicator component, and so we need to await ~1s to hide the indicator: page end + 500ms in `hideDelay` + 400ms in the css transition.\r\n\r\nNuxtLoadingIndicator should expose the `hideDelay` or `force` prop without needing to rewrite it, `hideDelay: 0` should be the default value.\r\n\r\nYou can check the SB reproduction:\r\n- open preview in a new tab\r\n- check the delay when navigating\r\n- open devtools and find `_nuxt/node_modules/nuxt/dist/app/composables/loading-indicator.js?v=\u003Csome_version>` in the source tab\r\n- add a breakpoint in L9\r\n- refresh the page and set `hideDelay` to 0\r\n- navigate again\r\n\r\n### Additional context\r\n\r\n_No response_\r\n\r\n### Logs\r\n\r\n_No response_",[3072,3075],{"name":3073,"color":3074},"enhancement","8DEF37",{"name":3076,"color":3077},"馃嵃 p2-nice-to-have","0E8A16",26637,"weird behavior with loading indicator component","2025-04-03T15:17:07Z","https://github.com/nuxt/nuxt/issues/26637",0.6444981,{"description":3084,"labels":3085,"number":3087,"owner":3023,"repository":3023,"state":3052,"title":3088,"updated_at":3089,"url":3090,"score":3091},"The loading indicatior name prop in nuxt.config.js is ignored. This is an error, here's what I get:\r\n\r\n```\r\nloadingIndicator : {\r\n name: 'pulse',\r\n color: '#e3342f',\r\n background: '#f1f5f8'\r\n },\r\n```\r\n\r\n\r\n\n\n\u003C!--cmty-->\u003C!--cmty_prevent_hook-->\n\u003Cdiv align=\"right\">\u003Csub>\u003Cem>This question is available on \u003Ca href=\"https://cmty.app/nuxt\">Nuxt\u003C/a> community (\u003Ca href=\"https://cmty.app/nuxt/nuxt.js/issues/c7802\">#c7802\u003C/a>)\u003C/em>\u003C/sub>\u003C/div>",[3086],{"name":3049,"color":3050},3939,"loadingIndicator name is ignored","2023-01-18T16:26:49Z","https://github.com/nuxt/nuxt/issues/3939",0.65414315,{"description":3093,"labels":3094,"number":3097,"owner":3023,"repository":3023,"state":3052,"title":3098,"updated_at":3099,"url":3100,"score":3101},"### Environment\r\n\r\n------------------------------\r\n- Operating System: `Windows_NT`\r\n- Node Version: `v16.16.0`\r\n- Nuxt Version: `3.2.0`\r\n- Nitro Version: `2.2.1`\r\n- Package Manager: `yarn@1.22.15`\r\n- Builder: `vite`\r\n- User Config: `modules`\r\n- Runtime Modules: `@nuxtjs/tailwindcss@6.4.0`, `@nuxtjs/fontaine@0.2.4`, `nuxt-icon@0.2.11`, `@nuxt/devtools@0.1.2`, `@nuxt/image-edge@1.0.0-27919678.2f5b64b`, `@nuxtjs/google-fonts@3.0.0-1`\r\n- Build Modules: `-`\r\n------------------------------\r\n\r\n### Reproduction\r\n\r\nhttps://stackblitz.com/edit/github-tvjuvn?file=app.vue\r\n\r\n### Describe the bug\r\n\r\nIt seems that `NuxtLoadingIndicator` is not setting its opacity to `1` when it needs to be shown. This is a screenshot of the moment the loading indicator should appear:\r\n\r\n\r\n\r\n\r\n\r\n\r\n### Additional context\r\n\r\nNot working on v3.1.2 and edge either.\r\n\r\n### Logs\r\n\r\n_No response_",[3095,3096],{"name":3061,"color":3062},{"name":3020,"color":3021},18969,"`\u003CNuxtLoadingIndicator>` not working on `3.2.0`","2023-02-12T07:55:54Z","https://github.com/nuxt/nuxt/issues/18969",0.65634084,{"labels":3103,"number":3106,"owner":3023,"repository":3023,"state":3052,"title":3107,"updated_at":3108,"url":3109,"score":3110},[3104,3105],{"name":3073,"color":3074},{"name":3049,"color":3050},8580,"Different colors for the loading indicator when user has dark mode enabled","2023-07-26T09:16:54Z","https://github.com/nuxt/nuxt/issues/8580",0.65804666,{"description":3112,"labels":3113,"number":3116,"owner":3023,"repository":3023,"state":3052,"title":3117,"updated_at":3118,"url":3119,"score":3120},"### Environment\n\nNuxt project info: 17:11:46\r\n\r\n------------------------------\r\n- Operating System: `Linux`\r\n- Node Version: `v16.15.0`\r\n- Nuxt Version: `3.1.1`\r\n- Nitro Version: `2.1.0`\r\n- Package Manager: `npm@8.5.5`\r\n- Builder: `vite`\r\n- User Config: `typescript`, `nitro`, `app`, `alias`, `css`, `vite`, `runtimeConfig`\r\n- Runtime Modules: `-`\r\n- Build Modules: `-`\n\n### Reproduction\n\nStackBlitz from the docs: https://nuxt.com/docs/api/components/nuxt-loading-indicator#nuxtloadingindicator\r\n\r\nhttps://stackblitz.com/github/nuxt/nuxt/tree/main/examples/routing/pages?file=package.json&terminal=dev\n\n### Describe the bug\n\nLoading indicator never appears\n\n### Additional context\n\nAfter updating to Nuxt 3.1.1, the NuxtLoadingIndicator component stopped working.\n\n### Logs\n\n_No response_",[3114,3115],{"name":3061,"color":3062},{"name":3020,"color":3021},18630,"NuxtLoadingIndicator not working anymore","2024-07-28T00:38:37Z","https://github.com/nuxt/nuxt/issues/18630",0.66607034,{"description":3122,"labels":3123,"number":3131,"owner":3023,"repository":3132,"state":3052,"title":3133,"updated_at":3134,"url":3135,"score":3136},"### Environment\n\nN/A\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\n3.0.0\n\n### Reproduction\n\nhttps://ui.nuxt.com/components/input#loading-icon\n\n### Description\n\nBoth icons, the one shown in the example `i-lucide-repeat-2` and the component's default prop, `i-lucide-refresh-cw` look bad when rotated. I think there's a lot of room for improvement, these icons aren't meant to be animated.\n\nLuckily, there are some Lucide icons which _are_ designed to be animated.\n\nHow about https://lucide.dev/icons/loader-circle?\n\nOr https://lucide.dev/icons/loader?\n\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[3124,3125,3128],{"name":3036,"color":3037},{"name":3126,"color":3127},"v3","49DCB8",{"name":3129,"color":3130},"triage","ffffff",4162,"ui","`Input`'s default loading icon needs improvement","2025-05-16T16:06:11Z","https://github.com/nuxt/ui/issues/4162",0.6719953,["Reactive",3138],{},["Set"],["ShallowReactive",3141],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$fZWj9Ede_h5TFqxXaMP_3NFHT9fZBYbE6oaTIq00hSDw":-1},"/nuxt/nuxt/7123"]