`\n\nit doesn't work that way\n\nI really ask for help!",[2039,2042],{"name":2040,"color":2041},"question","d876e3",{"name":1988,"color":1989},3098,"Table filtered, sorting fetch","2025-01-14T11:05:37Z","https://github.com/nuxt/ui/issues/3098",0.71262866,{"description":2049,"labels":2050,"number":2054,"owner":1994,"repository":1995,"state":1996,"title":2055,"updated_at":2056,"url":2057,"score":2058},"### Description\n\n### Feature Request: Add `variant` and `status-position` props to `UProgress` component\n\n#### Description\nI’m a junior developer, and I’ve been working on enhancing the flexibility of the `Progress` component by adding two new props: `variant` and `status-position`. These props allow for better customization, especially when using the `Progress` component in different design contexts.\n\n- **`variant`**: This prop allows you to choose between two styles for the progress bar: `linear` and `circular`. The `circular` variant provides a circular progress bar instead of the default linear style.\n \n- **`status-position`**: This prop controls the position of the progress status (the percentage or label) relative to the progress bar. The possible values are:\n - `inside`: The status is displayed inside the circle (for the `circular` variant).\n - `outside`: The status is displayed outside the circle.\n\n#### Motivation\nThis update would help in using the `Progress` component more flexibly across different layouts, providing options for both linear and circular progress indicators with customizable label placements.\n\n#### What I've Done\nI’m still a junior developer, so the implementation is not perfect, but a good portion of the work is done. I’ve added the `variant` and `status-position` props to the `Progress` component. I’d love to know if this is something you’d like to integrate into the main repository and whether I can open a pull request for it.\n\n#### Additional Notes\n- The `variant` prop accepts values `linear` or `circular`.\n- The `status-position` prop accepts values `inside` or `outside`.\n \nWould love to hear your thoughts on this approach!\n\n\n### Additional context\n\n[Reka UI : Progress Circular](https://reka-ui.com/examples/progress-circular)",[2051,2052,2053],{"name":1985,"color":1986},{"name":1988,"color":1989},{"name":1991,"color":1992},3728,"[UProgress]: Add `variant` and `status-position` props","2025-03-29T14:31:22Z","https://github.com/nuxt/ui/issues/3728",0.71763664,{"description":2060,"labels":2061,"number":2067,"owner":1994,"repository":1995,"state":2068,"title":2069,"updated_at":2070,"url":2071,"score":2072},"### Environment\n\n- Operating System: Darwin\n- Node Version: v22.11.0\n- Nuxt Version: -\n- CLI Version: 3.15.0\n- Nitro Version: -\n- Package Manager: npm@10.9.0\n- Builder: -\n- User Config: -\n- Runtime Modules: -\n- Build Modules: -\n\n### Is this bug related to Nuxt or Vue?\n\nVue\n\n### Version\n\n3.0.0-alpha.9\n\n### Reproduction\n\nhttps://github.com/ckvv/vite-project\n\n### Description\n\n# console\n\n```\nvue.js?v=b15c3109:2116 [Vue warn]: inject() can only be used inside setup() or functional components.\nwarn$1 @ vue.js?v=b15c3109:2116Understand this warningAI\nvue.f49591ad.mjs?v=cb52c83a:77 Unhead is missing Vue context, falling back to shared context. This may have unexpected results.\ninjectHead @ vue.f49591ad.mjs?v=cb52c83a:77Understand this warningAI\nvue.js?v=b15c3109:2116 [Vue warn]: injection \"Symbol(route location)\" not found. \n at \u003CLink type=undefined disabled=false class=\"rounded-[calc(var(--ui-radius)*1.5)] font-medium inline-flex items-center focus:outline-none disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors px-2.5 py-1.5 text-sm gap-1.5 text-[var(--ui-bg)] bg-[var(--ui-primary)] hover:bg-[var(--ui-primary)]/75 disabled:bg-[var(--ui-primary)] aria-disabled:bg-[var(--ui-primary)] focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[var(--ui-primary)]\" ... > \n at \u003CButton> \n at \u003CToastProvider swipe-direction=\"right\" duration=5000 > \n at \u003CToaster key=0 > \n at \u003CTooltipProvider> \n at \u003CConfigProvider use-id=fn\u003Cuse-id> dir=\"ltr\" > \n at \u003CApp> \n at \u003CApp>\nwarn$1 @ vue.js?v=b15c3109:2116Understand this warningAI\nvue.js?v=b15c3109:2116 [Vue warn]: injection \"Symbol(router)\" not found. \n at \u003CRouterLink class=\"rounded-[calc(var(--ui-radius)*1.5)] font-medium inline-flex items-center focus:outline-none disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors px-2.5 py-1.5 text-sm gap-1.5 text-[var(--ui-bg)] bg-[var(--ui-primary)] hover:bg-[var(--ui-primary)]/75 disabled:bg-[var(--ui-primary)] aria-disabled:bg-[var(--ui-primary)] focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[var(--ui-primary)]\" raw=true to=\"#\" ... > \n at \u003CLink type=undefined disabled=false class=\"rounded-[calc(var(--ui-radius)*1.5)] font-medium inline-flex items-center focus:outline-none disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors px-2.5 py-1.5 text-sm gap-1.5 text-[var(--ui-bg)] bg-[var(--ui-primary)] hover:bg-[var(--ui-primary)]/75 disabled:bg-[var(--ui-primary)] aria-disabled:bg-[var(--ui-primary)] focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[var(--ui-primary)]\" ... > \n at \u003CButton> \n at \u003CToastProvider swipe-direction=\"right\" duration=5000 > \n at \u003CToaster key=0 > \n at \u003CTooltipProvider> \n at \u003CConfigProvider use-id=fn\u003Cuse-id> dir=\"ltr\" > \n at \u003CApp> \n at \u003CApp>\nwarn$1 @ vue.js?v=b15c3109:2116Understand this warningAI\nvue.js?v=b15c3109:2116 [Vue warn]: injection \"Symbol(route location)\" not found. \n at \u003CRouterLink class=\"rounded-[calc(var(--ui-radius)*1.5)] font-medium inline-flex items-center focus:outline-none disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors px-2.5 py-1.5 text-sm gap-1.5 text-[var(--ui-bg)] bg-[var(--ui-primary)] hover:bg-[var(--ui-primary)]/75 disabled:bg-[var(--ui-primary)] aria-disabled:bg-[var(--ui-primary)] focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[var(--ui-primary)]\" raw=true to=\"#\" ... > \n at \u003CLink type=undefined disabled=false class=\"rounded-[calc(var(--ui-radius)*1.5)] font-medium inline-flex items-center focus:outline-none disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors px-2.5 py-1.5 text-sm gap-1.5 text-[var(--ui-bg)] bg-[var(--ui-primary)] hover:bg-[var(--ui-primary)]/75 disabled:bg-[var(--ui-primary)] aria-disabled:bg-[var(--ui-primary)] focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[var(--ui-primary)]\" ... > \n at \u003CButton> \n at \u003CToastProvider swipe-direction=\"right\" duration=5000 > \n at \u003CToaster key=0 > \n at \u003CTooltipProvider> \n at \u003CConfigProvider use-id=fn\u003Cuse-id> dir=\"ltr\" > \n at \u003CApp> \n at \u003CApp>\nwarn$1 @ vue.js?v=b15c3109:2116Understand this warningAI\nvue.js?v=b15c3109:2116 [Vue warn]: Unhandled error during execution of setup function \n at \u003CRouterLink class=\"rounded-[calc(var(--ui-radius)*1.5)] font-medium inline-flex items-center focus:outline-none disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors px-2.5 py-1.5 text-sm gap-1.5 text-[var(--ui-bg)] bg-[var(--ui-primary)] hover:bg-[var(--ui-primary)]/75 disabled:bg-[var(--ui-primary)] aria-disabled:bg-[var(--ui-primary)] focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[var(--ui-primary)]\" raw=true to=\"#\" ... > \n at \u003CLink type=undefined disabled=false class=\"rounded-[calc(var(--ui-radius)*1.5)] font-medium inline-flex items-center focus:outline-none disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-75 aria-disabled:opacity-75 transition-colors px-2.5 py-1.5 text-sm gap-1.5 text-[var(--ui-bg)] bg-[var(--ui-primary)] hover:bg-[var(--ui-primary)]/75 disabled:bg-[var(--ui-primary)] aria-disabled:bg-[var(--ui-primary)] focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[var(--ui-primary)]\" ... > \n at \u003CButton> \n at \u003CToastProvider swipe-direction=\"right\" duration=5000 > \n at \u003CToaster key=0 > \n at \u003CTooltipProvider> \n at \u003CConfigProvider use-id=fn\u003Cuse-id> dir=\"ltr\" > \n at \u003CApp> \n at \u003CApp>\nwarn$1 @ vue.js?v=b15c3109:2116Understand this warningAI\nvue-router.mjs?v=cb52c83a:1506 Uncaught TypeError: Cannot read properties of undefined (reading 'resolve')\n at ComputedRefImpl.fn (vue-router.mjs?v=cb52c83a:1506:19)\n at refreshComputed (vue.js?v=b15c3109:636:29)\n at get value (vue.js?v=b15c3109:1828:5)\n at useLink (vue-router.mjs?v=cb52c83a:1547:22)\n at setup (vue-router.mjs?v=cb52c83a:1593:27)\n at callWithErrorHandling (vue.js?v=b15c3109:2263:19)\n at setupStatefulComponent (vue.js?v=b15c3109:9983:25)\n at setupComponent (vue.js?v=b15c3109:9944:36)\n at mountComponent (vue.js?v=b15c3109:7300:7)\n at processComponent (vue.js?v=b15c3109:7266:9)Understand this errorAI\nlocalhost/:1 Unchecked runtime.lastError: The message port closed before a response was received.Understand this errorAI\nlocalhost/:1 Unchecked runtime.lastError: The message port closed before a response was received.Understand this errorAI\ncontent_script.js:6257 [Violation] Added non-passive event listener to a scroll-blocking 'touchstart' event. Consider marking event handler as 'passive' to make the page more responsive. See https://www.chromestatus.com/feature/5745543795965952\n```\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[2062,2063,2064],{"name":2005,"color":2006},{"name":1988,"color":1989},{"name":2065,"color":2066},"vue","42b883",2764,"closed","Nuxt UI is not compatible with Vue projects","2024-12-18T13:58:14Z","https://github.com/nuxt/ui/issues/2764",0.6682476,{"description":2074,"labels":2075,"number":2078,"owner":1994,"repository":1995,"state":2068,"title":2079,"updated_at":2080,"url":2081,"score":2082},"### Environment\n\n- Operating System: Linux\n- Node Version: v22.4.0\n- Nuxt Version: 3.14.159\n- CLI Version: 3.15.0\n- Nitro Version: 2.10.4\n- Package Manager: pnpm@9.13.2\n- Builder: -\n- User Config: default\n- Runtime Modules: @nuxt/ui@3.0.0-alpha.8\n- Build Modules: -\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\nv3.0.0-alpha.8\n\n### Reproduction\n\n-\n\n### Description\n\nDefault classes of container in [docs](https://ui3.nuxt.dev/components/container#theme) is:\n```ts\nexport default defineAppConfig({\n ui: {\n container: {\n base: 'max-w-[var(--ui-container)] mx-auto px-4 sm:px-6 lg:px-8'\n }\n }\n})\n```\n**But no one of classes except `mx-auto` is not was created.**\nI change `--ui-container` variable like in [docs](https://ui3.nuxt.dev/getting-started/theme#container):\n```css\n/** app.css */\n\n@import 'tailwindcss';\n@import '@nuxt/ui';\n\n@theme {\n --container-xl: 1280px;\n}\n\n:root {\n --ui-container: var(--container-xl);\n}\n```\nAs result, container classes is `max-w-7xl mx-auto px-4 sm:px-6 lg:px-8` and still not was created, except `mx-auto`.\n\nBut if i create `app.config.ts`:\n```ts\nexport default defineAppConfig({\n ui: {\n container: {\n base: 'max-w-[var(--ui-container)] mx-auto px-4 sm:px-6 lg:px-8'\n }\n }\n})\n```\nAll is ok, width and other classes are created and applying.\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[2076,2077],{"name":2005,"color":2006},{"name":1988,"color":1989},2655,"Classes of container component are not working properly","2024-11-16T13:13:33Z","https://github.com/nuxt/ui/issues/2655",0.6941629,{"description":2084,"labels":2085,"number":2088,"owner":1994,"repository":2031,"state":2068,"title":2089,"updated_at":2090,"url":2091,"score":2092},"### Environment\n\nMacOS, Chrome, Firefox and Safari\n\n### Reproduction\n\n### to reproduce\n1.go to the a module category page with direct access, such as [security](https://nuxt.com/modules?category=Security) or [devtools](https://nuxt.com/modules?category=Devtools) or do a page refresh from any of the category page.\n2. open a bunch of module links in a NEW TAB via right click \"open in a new tab\" or CMD + Click\n3. find out that when you open a new link to a module, for instance, [nuxt-security](), the target URL that is actually opened is [nuxt-image](https://nuxt.com/modules/image)\n\n\nIt happens when opening a new tabs from the \"security\" category `?category=Security`\nIt only happens when opening the security category on direct access by typing accessing url directly\nIt does not happen when opening the link on the same window on the `?category=Security` page\nIt does not happen when opening links from [module page without category slug](https://nuxt.com/modules)\n\n\n\n### Describe the bug\n\nThere is a unpredictable behaviour. When i click on nuxt modules cards that links to Nuxt 3 modules on a new tab, it open a different link than the expected one.\n\nWhen I try direct access by clicking on the link (not a open in a new tab or CMD + Click , it works as expected\n\n### Additional context\n\n\n### additional info\nreproduced on Chrome and Safari.\nhttps://github.com/user-attachments/assets/0742a7fa-80c6-4556-b31c-26f181d9f92b\n\n### guess\n when browsing a category with an active filter, the opened links pattern (`@nuxtjs/kinde`, `@logto/nuxt`, `@nuxt/devtools `) actually match the links displayed on the [root main modules page](https://nuxt.com/modules) without active filter `https://nuxt.com/modules`.\n\n### Logs\n\n```shell-script\n\n```",[2086],{"name":2005,"color":2087},"ff281a",1750,"(nuxt website): module cards links are inconsistent at open new tab","2025-03-21T16:12:36Z","https://github.com/nuxt/nuxt.com/issues/1750",0.6960577,{"description":2094,"labels":2095,"number":2096,"owner":1994,"repository":2031,"state":2068,"title":2097,"updated_at":2098,"url":2099,"score":2100},"After using `pnpm update` to upgrade vue to 3.4.3, the console throws a lot of `Hydration mismatch`. If I am using vue 3.3.13, no `Hydration mismatch` warnings will be thrown.\r\n\r\n\u003Cimg width=\"1402\" alt=\"SCR-20240103-qagg\" src=\"https://github.com/nuxt/nuxt.com/assets/133459587/188ac1c4-e19a-4570-a5d0-4863c92a7bda\">\r\n",[],1467,"About vue@3.4.3 causing hydration mismatch","2024-05-03T00:34:36Z","https://github.com/nuxt/nuxt.com/issues/1467",0.699355,["Reactive",2102],{},["Set"],["ShallowReactive",2105],{"TRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"1dgwoe74YPoAXq9zCorE-2PiJMOvJNdRpvrZJ4hLjs8":-1},"/nuxt/ui/3427"]