\n\n \u003C!-- \u003CUAccordion :items=\"items\" /> -->\n\n \u003CUDrawer id=\"drawer\">\n \u003CUButton label=\"Open\" color=\"surface\" variant=\"solid\" />\n \u003Ctemplate #content>\n \u003CBaseUiPlaceholder class=\"h-48 m-4\" />\n \u003C/template>\n \u003C/UDrawer>\n```\n\nIf we use Accordion or Drawer (as mentioned in above code), we get 500 Error and app crashes. \n\n\n\nIf we comment out the Accordion and Drawer, no error comes, and app works nicely. \n\n\n\nSee: No error if we don't use the error-causing components. \n\n\n\n\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[3032,3035],{"name":3033,"color":3034},"bug","d73a4a",{"name":3036,"color":3037},"v3","49DCB8",2769,"ui","closed","[v3] Error `$setup.useId is not a function` in Accordion, Drawer, etc.","2024-11-26T13:44:15Z","https://github.com/nuxt/ui/issues/2769",0.63069695,{"description":3046,"labels":3047,"number":3048,"owner":3022,"repository":3049,"state":3040,"title":3050,"updated_at":3051,"url":3052,"score":3053},"On the 'Enterprise Jobs' page, location badges were closely together on mobile screens. I removed the `mr-3` class from the badge element and placed the badges inside a parent `\u003Cdiv>` with the classes` flex`, `flex-wrap`, and `gap-3` Now it won't stick together and will look good on mobile devices.\r\n\r\n| **BEFORE** | **AFTER** | \r\n|-------- | ------ | \r\n|  |  |\r\n\r\n\r\n\r\n\n```[tasklist]\n### Tasks\n```\n",[],1403,"nuxt.com","Spacing issue with Location badges on 'Enterprise Jobs' page for mobile screens","2024-09-19T19:38:43Z","https://github.com/nuxt/nuxt.com/issues/1403",0.66370684,{"description":3055,"labels":3056,"number":3057,"owner":3022,"repository":3049,"state":3040,"title":3058,"updated_at":3059,"url":3060,"score":3061},"If you go to any blog and click `Edit on Github` on aside it will bring you to a 404 on github.\r\n\r\nCode that is incorrect: https://github.com/nuxt/nuxt.com/blob/a9b1e32c93714f23703f12add0f0c17cc518bd2a/pages/blog/%5Bslug%5D.vue#L66\r\n\r\nNeeds to be: \r\n\r\n```\r\nhttps://github.com/nuxt/nuxt.com/edit/main/content/${article.value._file}\r\n```",[],1533,"blog \"Edit on Github\" url is broke.","2024-03-11T22:23:34Z","https://github.com/nuxt/nuxt.com/issues/1533",0.67079926,{"description":3063,"labels":3064,"number":3068,"owner":3022,"repository":3039,"state":3040,"title":3069,"updated_at":3070,"url":3071,"score":3072},"### Description\n\nI would like the ability to add / enable animations like slide / fade when the carousel changes the current page.\n\nI noticed from the repo links refering to https://www.embla-carousel.com/plugins. This present some animations like sliding https://www.embla-carousel.com/plugins/autoplay or fading https://www.embla-carousel.com/plugins/fade.\n\nI tried the prop `fade` whith `\u003CUCarousel />` but didn't see the effect.\n\nThank you.\n\n### Additional context\n\n_No response_",[3065],{"name":3066,"color":3067},"enhancement","a2eeef",3101,"[Feature request] animation on change for carousel","2025-01-25T13:14:24Z","https://github.com/nuxt/ui/issues/3101",0.67354834,{"description":3074,"labels":3075,"number":3080,"owner":3022,"repository":3039,"state":3040,"title":3081,"updated_at":3082,"url":3083,"score":3084},"### Description\n\nBefore using `nuxt ui`, I briefly skimmed through the repository and found an already closed issue: [3018](https://github.com/nuxt/ui/issues/3018)\n\nThe error and solution mentioned in this issue (the [v2 documentation](https://ui.nuxt.com/getting-started/installation) indeed did not mention the solution) can actually be resolved by adding `tailwindcss@next` to the `peerDependencies` section in the `package.json` file.\n\nThis is because when [nuxi module add](https://github.com/nuxt/cli/blob/1afc06e8d08ea781fc5fede343de8d68865c2b4e/packages/nuxi/src/commands/module/add.ts#L134) installs a module, it not only installs the module itself but also scans the module package's `peerDependencies`.\n\nFor example, when using `nuxi module add pinia`, since `@pinia/nuxt` has `pinia` listed in its `peerDependencies` in the [package.json](https://github.com/vuejs/pinia/blob/3b21e08b6a068d18112b915b83f702fb5504ab73/packages/nuxt/package.json#L51C4-L51C20), both `@pinia/nuxt` and `pinia` will be automatically installed during the module installation.\n\nIf there are dependencies in `peerDependencies` that you do not want `nuxi module` to install automatically, you can use `peerDependenciesMeta` to ignore them, for [example](https://github.com/atinux/nuxt-auth-utils/blob/6b61b8888e3b3c6f60fd5ff767b7f0aa6cf09fc9/package.json#L57):\n\n```\n\"peerDependenciesMeta\": {\n \"pinia\": {\n \"optional\": true\n }\n },\n```\n\nTherefore, Nuxt UI can specify `tailwindcss@next` in the `peerDependencies` of `package.json`, ensuring Tailwind CSS is automatically installed when the Nuxt UI module is installed.\n\nThis solution applies to both v3 and v2.\n\n> PS: I noticed `typescript` in the `peerDependencies` of the v3 package.json. Is this a necessary dependency similar to `tailwindcss`? If not, after adding tailwindcss, perhaps `peerDependenciesMeta` could be used to ignore it.",[3076,3079],{"name":3077,"color":3078},"question","d876e3",{"name":3036,"color":3037},3349,"Add \"tailwindcss@next\" to the \"peerDependencies\" section in the package.json file.","2025-02-21T17:05:10Z","https://github.com/nuxt/ui/issues/3349",0.6742169,{"description":3086,"labels":3087,"number":3088,"owner":3022,"repository":3049,"state":3040,"title":3089,"updated_at":3090,"url":3091,"score":3092},"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.67843574,{"description":3094,"labels":3095,"number":3098,"owner":3022,"repository":3039,"state":3040,"title":3099,"updated_at":3100,"url":3101,"score":3102},"### Description\n\nHello, I just wanted to overwrite shadow-sm with another shadow in the card root slot.\nBut I failed to do so. I tried the :ui way and the app.config.ts way but in both cases the new class \"shadow-card\" ended up BEHIND \"shadow-sm\".\n\n```\n card: {\n slots: {\n root: \"shadow-card\",\n },\n },\n```\n\nSo shadow-card always gets overwritten by shadow-sm cause the code always ends up like this:\n```\n\u003Cdiv class=\"bg-[var(--ui-bg)] ring ring-[var(--ui-border)] divide-y divide-[var(--ui-border)] rounded-[calc(var(--ui-radius)*2)] shadow-sm shadow-card\">\n```\n\nso how can I overwrite shadow-sm here?",[3096,3097],{"name":3077,"color":3078},{"name":3036,"color":3037},2936,"Overwrite css classes of slots","2025-01-08T16:26:22Z","https://github.com/nuxt/ui/issues/2936",0.6846824,{"description":3104,"labels":3105,"number":3107,"owner":3022,"repository":3039,"state":3040,"title":3108,"updated_at":3109,"url":3110,"score":3111},"### Environment\n\n- Node version: 22.9.0 (Docker image 22.9.0-alpine)\n- Nuxt version: 3.14.1592\n- Package manager: pnpm@9.14.2\n- nuxt/ui module version: 2.19.2\n- package.json\n ```\n {\n \"name\": \"nuxt-app\",\n \"private\": true,\n \"type\": \"module\",\n \"scripts\": {\n \"build\": \"nuxt build\",\n \"dev\": \"nuxt dev\",\n \"generate\": \"nuxt generate\",\n \"preview\": \"nuxt preview\",\n \"postinstall\": \"nuxt prepare\"\n },\n \"dependencies\": {\n \"@nuxt/ui\": \"^2.19.2\",\n \"nuxt\": \"^3.14.1592\",\n \"vue\": \"latest\",\n \"vue-router\": \"latest\"\n },\n \"packageManager\": \"pnpm@9.14.2+sha512.6e2baf77d06b9362294152c851c4f278ede37ab1eba3a55fda317a4a17b209f4dbb973fb250a77abc463a341fcb1f17f17cfa24091c4eb319cda0d9b84278387\"\n }\n ```\n- Dockerfile\n ```\n ARG NODE_DOCKER_IMAGE=22.9.0-alpine\n FROM node:$NODE_DOCKER_IMAGE AS base\n \n ARG PORT=3000\n \n ENV NODE_ENV=production\n \n WORKDIR /app\n # Build\n FROM base AS builder\n \n RUN npm install -g pnpm\n \n COPY --link package.json .\n COPY --link pnpm-lock.yaml .\n \n RUN pnpm install --production=true\n \n COPY --link . .\n \n RUN pnpm build\n \n # Run\n FROM base\n \n ENV PORT=$PORT\n \n COPY --from=builder /app/.output /app/.output\n \n COPY --from=builder /app/docker-entrypoint.sh /usr/local/bin/docker-entrypoint\n \n RUN chmod +x /usr/local/bin/docker-entrypoint\n \n ENTRYPOINT [\"docker-entrypoint\"]\n ```\n\n\n### Version\n\nv2.19.2\n\n### Reproduction\n\n1. Create the \"frontend\" Nuxt app `pnpx nuxi@latest init frontend`\n2. `cd frontend`\n3. Add the \"nux/ui\" module `pnpx nuxi@latest module add ui`\n4. Put the Dockerfile described inside the frontend folder\n5. `docker build .`\n\n### Description\n\nThe build fails:\n```\n=> ERROR [builder 6/6] RUN pnpm build 3.4s\n------ \n > [builder 6/6] RUN pnpm build: \n0.512 \n0.512 > nuxt-app@ build /app \n0.512 > nuxt build \n0.512 \n0.658 Nuxt 3.14.1592\n1.374 [nuxt:tailwindcss] ℹ Using default Tailwind CSS file\n1.589 ℹ Nuxt Icon server bundle mode is set to local\n3.009 ℹ Building client...\n3.018 ℹ vite v5.4.11 building for production...\n3.040 ℹ transforming...\n3.350 ℹ ✓ 57 modules transformed.\n3.351 \n3.351 ERROR x Build failed in 331ms\n3.351 \n3.351 \n3.351 ERROR Nuxt Build Error: [vite:css] [postcss] Cannot find module 'tailwindcss/lib/lib/defaultExtractor.js'\n3.351 Require stack:\n3.351 - /app/.nuxt/nuxtui-tailwind.config.cjs\n3.351 file: /app/node_modules/.pnpm/tailwindcss@3.4.15/node_modules/tailwindcss/tailwind.css:undefined:NaN\n3.351 \n3.351 Require stack:\n3.351 - .nuxt/nuxtui-tailwind.config.cjs\n3.351 file: node_modules/.pnpm/tailwindcss@3.4.15/node_modules/tailwindcss/tailwind.css:undefined:NaN\n3.351 at Module._resolveFilename (node:internal/modules/cjs/loader:1248:15)\n3.351 at Function.resolve (node:internal/modules/helpers:145:19)\n3.351 at _resolve (node_modules/.pnpm/jiti@1.21.6/node_modules/jiti/dist/jiti.js:1:241814)\n3.351 at jiti (node_modules/.pnpm/jiti@1.21.6/node_modules/jiti/dist/jiti.js:1:244531)\n3.351 at .nuxt/nuxtui-tailwind.config.cjs:2:60\n3.351 at evalModule (node_modules/.pnpm/jiti@1.21.6/node_modules/jiti/dist/jiti.js:1:247313)\n3.351 at jiti (node_modules/.pnpm/jiti@1.21.6/node_modules/jiti/dist/jiti.js:1:245241)\n3.351 at .nuxt/tailwind.config.cjs:7:1\n3.351 at evalModule (node_modules/.pnpm/jiti@1.21.6/node_modules/jiti/dist/jiti.js:1:247313)\n3.351 at jiti (node_modules/.pnpm/jiti@1.21.6/node_modules/jiti/dist/jiti.js:1:245241)\n3.351 at node_modules/.pnpm/tailwindcss@3.4.15/node_modules/tailwindcss/lib/lib/load-config.js:56:30\n3.351 at loadConfig (node_modules/.pnpm/tailwindcss@3.4.15/node_modules/tailwindcss/lib/lib/load-config.js:58:6)\n3.351 at getTailwindConfig (node_modules/.pnpm/tailwindcss@3.4.15/node_modules/tailwindcss/lib/lib/setupTrackingContext.js:71:116)\n3.351 at node_modules/.pnpm/tailwindcss@3.4.15/node_modules/tailwindcss/lib/lib/setupTrackingContext.js:100:92\n3.351 at node_modules/.pnpm/tailwindcss@3.4.15/node_modules/tailwindcss/lib/processTailwindFeatures.js:46:11\n3.351 at plugins (node_modules/.pnpm/tailwindcss@3.4.15/node_modules/tailwindcss/lib/plugin.js:38:69)\n3.351 at LazyResult.runOnRoot (node_modules/.pnpm/postcss@8.4.49/node_modules/postcss/lib/lazy-result.js:329:16)\n3.351 at LazyResult.runAsync (node_modules/.pnpm/postcss@8.4.49/node_modules/postcss/lib/lazy-result.js:258:26)\n3.351 at LazyResult.async (node_modules/.pnpm/postcss@8.4.49/node_modules/postcss/lib/lazy-result.js:160:30)\n3.351 at LazyResult.then (node_modules/.pnpm/postcss@8.4.49/node_modules/postcss/lib/lazy-result.js:404:17)\n3.351 \n3.370 ELIFECYCLE Command failed with exit code 1.\n```\n\n### Additional context\n\nMaybe I'm facing the same problem stated in https://github.com/nuxt/ui/issues/1689\n\n### Logs\n\n```shell-script\n\n```",[3106],{"name":3033,"color":3034},2785,"Nuxt Build Error at build time with Docker","2024-11-27T10:23:20Z","https://github.com/nuxt/ui/issues/2785",0.68600863,{"description":3113,"labels":3114,"number":3117,"owner":3022,"repository":3039,"state":3040,"title":3118,"updated_at":3119,"url":3120,"score":3121},"### Environment\n\n------------------------------\n- Operating System: Darwin\n- Node Version: v23.1.0\n- Nuxt Version: 3.14.159\n- CLI Version: 3.15.0\n- Nitro Version: 2.10.4\n- Package Manager: bun@1.1.3\n- Builder: -\n- User Config: default\n- Runtime Modules: @nuxt/ui@3.0.0-alpha.8\n- Build Modules: -\n------------------------------\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\nhttps://github.com/brycesteve/nuxtUi500Repro\n\n### Description\n\nWhen using Nuxt UI from a layer, wrapping in `UApp` causes the following error:\n\n```\n500\nnull is not an object (evaluating 'currentRenderingInstance.ce')\n\nat renderComponentRoot (./node_modules/@vue/runtime-core/dist/runtime-core.cjs.js:3708:44)\nat renderComponentSubTree (./node_modules/@vue/server-renderer/dist/server-renderer.cjs.js:465:65)\nat renderComponentVNode (./node_modules/@vue/server-renderer/dist/server-renderer.cjs.js:417:36)\nat ssrRenderComponent (./node_modules/@vue/server-renderer/dist/server-renderer.cjs.js:57:32)\nat _sfc_ssrRender (:52:49)\nat renderComponentSubTree (./node_modules/@vue/server-renderer/dist/server-renderer.cjs.js:460:20)\nat renderComponentVNode (./node_modules/@vue/server-renderer/dist/server-renderer.cjs.js:417:36)\nat ssrRenderComponent (./node_modules/@vue/server-renderer/dist/server-renderer.cjs.js:57:32)\nat _sfc_ssrRender (:46:49)\n```\n\nRemoving `UApp` stops the error from happening. `UApp` also works correctly when not in a layer.\n\nIn the reproduction, Nuxt UI is added to the layer in `~/layers/ui`.\n\nRunning `bun --bun run dev` in the project root causes the error. Switching to `~/layers/ui` and running `bun --bun run dev` doesn't have the same error (`App.vue` in `~/layers/ui/.playground` is the same as the root `App.vue`). So, the issue is something to do with Nuxt UI being extended from a layer. The other components I've tried seem to work ok.\n\nI have read in a few places that this might be something to do with multiple Vue instances being created. But if it is, I can't seem to find a config that allows it to work.\n\nShould Nuxt UI work from a layer, or is it not compatible this way? If it should, is there something I'm doing wrong, or does anyone have a fix to make this work?\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[3115,3116],{"name":3033,"color":3034},{"name":3036,"color":3037},2622,"Nuxt UI in layer causes 500 error when wrapping in UApp","2024-12-05T13:48:51Z","https://github.com/nuxt/ui/issues/2622",0.6896458,["Reactive",3123],{},["Set"],["ShallowReactive",3126],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$fhVuoJ9YtHx3uj8fCpu8ouKW7JZELwS7T5uTFs_ACRqg":-1},"/nuxt/ui/3590"]