\n\nCompact sidebar upon hovering\n\n\u003Cimg width=\"278\" height=\"458\" alt=\"Image\" src=\"https://github.com/user-attachments/assets/df602a26-f92e-42d6-a346-67e0cefbe251\" />\n\n\u003CUNavigationMenu\n :items=\"MENU_ITEMS\"\n :collapsed=\"isToggle\"\n tooltip\n popover\n orientation=\"vertical\"\n :unmount-on-hide=\"false\"\n class=\"overflow-y-auto custom-scrollbar px-2 py-2 flex-2\"\n >\n \u003C/UNavigationMenu>\n\nheres my MENU ITEMS:\nexport const MENU_ITEMS: NavigationMenuItem[] = [\n { label: 'Navigation', type: 'label' },\n {\n label: 'Transaction',\n icon: 'i-material-symbols:inventory',\n children: [\n {\n label: 'GL POS Sales Amount',\n icon: 'i-material-symbols:article-shortcut-outline',\n children: [\n {\n label: 'Process',\n icon: 'uim:process',\n to: '/pos-gl',\n },\n ],\n },\n {\n label: 'GL POS Sales Quantity',\n icon: 'i-material-symbols:inventory',\n children: [\n {\n label: 'Process',\n icon: 'uim:process',\n to: '/pos-inventory',\n },\n ],\n },\n {\n label: 'Purchase Order',\n icon: 'i-icon-park-outline:order',\n children: [\n {\n label: 'Load',\n icon: 'material-symbols:database',\n to: '/purchase-order/load',\n },\n {\n label: 'Process',\n icon: 'uim:process',\n to: '/purchase-order/process',\n },\n ],\n },\n {\n label: 'PO Receiving',\n icon: 'i-cuida:box-outline',\n children: [\n {\n label: 'Load',\n icon: 'material-symbols:database',\n to: '/po-receiving/load',\n },\n {\n label: 'Process',\n icon: 'uim:process',\n to: '/po-receiving/process',\n },\n ],\n },\n {\n label: 'AP Invoice',\n icon: 'i-hugeicons:invoice-02',\n children: [\n {\n label: 'Load',\n icon: 'material-symbols:database',\n to: '/ap-invoice/load',\n },\n {\n label: 'Process',\n icon: 'uim:process',\n to: '/ap-invoice/process',\n },\n ],\n },\n {\n label: 'AP Payment',\n icon: 'i-hugeicons:payment-01',\n children: [\n {\n label: 'Load',\n icon: 'material-symbols:database',\n to: '/ap-payment/load',\n },\n {\n label: 'Process',\n icon: 'uim:process',\n to: '/ap-payment/process',\n },\n ],\n },\n ],\n },\n ],\n },\n];\n\n\n\nThank you nuxt ui fam.\n\n",[3172,3175],{"name":3173,"color":3174},"question","d876e3",{"name":3176,"color":3177},"v3","49DCB8",4543,"nuxt","ui","open","[UNavigationMenuBar] nested child pop up not appearing","2025-07-17T03:18:41Z","https://github.com/nuxt/ui/issues/4543",0.7873183,{"description":3187,"labels":3188,"number":3192,"owner":3179,"repository":3193,"state":3194,"title":3195,"updated_at":3196,"url":3197,"score":3198},"\n",[3189],{"name":3190,"color":3191},"bug","ff281a",745,"nuxt.com","closed","[Navbar] Teams are not displayed on dropdown","2022-07-02T19:05:53Z","https://github.com/nuxt/nuxt.com/issues/745",0.43638295,{"description":3200,"labels":3201,"number":93,"owner":3179,"repository":3193,"state":3194,"title":3202,"updated_at":3203,"url":3204,"score":3205},"",[],"Teams dropdown","2022-02-03T15:03:43Z","https://github.com/nuxt/nuxt.com/issues/1",0.6653024,{"description":3207,"labels":3208,"number":3210,"owner":3179,"repository":3193,"state":3194,"title":3211,"updated_at":3212,"url":3213,"score":3214},"\n",[3209],{"name":3190,"color":3191},50,"TeamsDropdown: No ellipsis on team label and avatar placeholder","2023-02-15T12:30:32Z","https://github.com/nuxt/nuxt.com/issues/50",0.7147397,{"description":3216,"labels":3217,"number":3210,"owner":3179,"repository":3220,"state":3194,"title":3221,"updated_at":3222,"url":3223,"score":3214},"To investigate",[3218],{"name":3190,"color":3219},"d73a4a","scripts","StripePricingTable script not triggering load promise ","2024-05-07T03:31:48Z","https://github.com/nuxt/scripts/issues/50",{"labels":3225,"number":3235,"owner":3179,"repository":3179,"state":3194,"title":3236,"updated_at":3237,"url":3238,"score":3239},[3226,3229,3232],{"name":3227,"color":3228},"stale","ffffff",{"name":3230,"color":3231},"pending triage","E99695",{"name":3233,"color":3234},"2.x","d4c5f9",7075,"Bootstrap Vue Navbar Dropdown Not Working After Nuxt Generate But Works In Nuxt Dev","2023-01-22T15:34:48Z","https://github.com/nuxt/nuxt/issues/7075",0.74369866,{"description":3200,"labels":3241,"number":3243,"owner":3179,"repository":3193,"state":3194,"title":3244,"updated_at":3245,"url":3246,"score":3247},[3242],{"name":3190,"color":3191},14,"Team should be fetched when switching param","2022-02-07T13:31:36Z","https://github.com/nuxt/nuxt.com/issues/14",0.7489766,{"description":3249,"labels":3250,"number":1473,"owner":3179,"repository":3193,"state":3194,"title":3252,"updated_at":3253,"url":3254,"score":3255},"https://volta.s3.fr-par.scw.cloud/Clean_Shot_2022_02_10_at_13_23_25_55c00268bc.mp4\n ",[3251],{"name":3190,"color":3191},"Team name in `[team]/settings`: input not updated","2023-02-15T12:30:33Z","https://github.com/nuxt/nuxt.com/issues/52",0.75894326,{"description":3257,"labels":3258,"number":3260,"owner":3179,"repository":3193,"state":3194,"title":3261,"updated_at":3262,"url":3263,"score":3264},"- [ ] Delay when hovering\n- [ ] Button shouldn't be clickable\n- [ ] When moving the mouse between the trigger and the popover, it disappears\n\n> I assume this would also be applicable to `Dropdown` component",[3259],{"name":3190,"color":3191},315,"Navbar popover issues with hover mode","2023-02-15T12:32:07Z","https://github.com/nuxt/nuxt.com/issues/315",0.77482486,{"description":3266,"labels":3267,"number":3260,"owner":3179,"repository":3271,"state":3194,"title":3272,"updated_at":3273,"url":3274,"score":3264},"Hi all,\r\n\r\nI am trying to test my nuxt app with @nuxt/test-utils, but I am stuck with this error (all components and layouts are listed as errors).\r\n\r\n```\r\nFAIL tests/start.test.js (51.639 s)\r\n browser\r\n ✕ setup nuxt (49957 ms)\r\n ✕ renders the index page (794 ms)\r\n\r\n ● browser › setup nuxt\r\n\r\n\r\n ERROR in ./layouts/error.vue\r\n Module build failed (from ./node_modules/vuetify-loader/lib/loader.js):\r\n NonErrorEmittedError: (Emitted value instead of an instance of Error) SyntaxError: Invalid or unexpected token\r\n\r\n at node_modules/@nuxt/webpack/node_modules/webpack/lib/NormalModule.js:313:13\r\n at node_modules/@nuxt/webpack/node_modules/loader-runner/lib/LoaderRunner.js:367:11\r\n at node_modules/@nuxt/webpack/node_modules/loader-runner/lib/LoaderRunner.js:172:11\r\n at loadLoader (node_modules/@nuxt/webpack/node_modules/loader-runner/lib/loadLoader.js:32:11)\r\n at iteratePitchingLoaders (node_modules/@nuxt/webpack/node_modules/loader-runner/lib/LoaderRunner.js:169:2)\r\n at runLoaders (node_modules/@nuxt/webpack/node_modules/loader-runner/lib/LoaderRunner.js:365:2)\r\n at NormalModule.doBuild (node_modules/@nuxt/webpack/node_modules/webpack/lib/NormalModule.js:295:3)\r\n at NormalModule.build (node_modules/@nuxt/webpack/node_modules/webpack/lib/NormalModule.js:446:15)\r\n at Compilation.buildModule (node_modules/@nuxt/webpack/node_modules/webpack/lib/Compilation.js:739:10)\r\n at node_modules/@nuxt/webpack/node_modules/webpack/lib/Compilation.js:981:14\r\n at node_modules/@nuxt/webpack/node_modules/webpack/lib/NormalModuleFactory.js:409:6\r\n at node_modules/@nuxt/webpack/node_modules/webpack/lib/NormalModuleFactory.js:155:13\r\n at AsyncSeriesWaterfallHook.eval [as callAsync] (eval at create (node_modules/tapable/lib/HookCodeFactory.js:33:10), \u003Canonymous>:6:1)\r\n at node_modules/@nuxt/webpack/node_modules/webpack/lib/NormalModuleFactory.js:138:29\r\n at node_modules/@nuxt/webpack/node_modules/webpack/lib/NormalModuleFactory.js:346:9\r\n @ ./.nuxt/t12hfdrq/index.js 27:0-48 550:0-32\r\n @ ./.nuxt/t12hfdrq/client.js\r\n @ multi ./node_modules/@nuxt/components/lib/installComponents.js ./.nuxt/t12hfdrq/client.js\r\n ERROR in ./layouts/default.vue\r\n Module build failed (from ./node_modules/vuetify-loader/lib/loader.js):\r\n NonErrorEmittedError: (Emitted value instead of an instance of Error) SyntaxError: Invalid or unexpected token\r\n at node_modules/@nuxt/webpack/node_modules/webpack/lib/NormalModule.js:313:13\r\n at node_modules/@nuxt/webpack/node_modules/loader-runner/lib/LoaderRunner.js:367:11\r\n at node_modules/@nuxt/webpack/node_modules/loader-runner/lib/LoaderRunner.js:172:11\r\n at loadLoader (node_modules/@nuxt/webpack/node_modules/loader-runner/lib/loadLoader.js:32:11)\r\n at iteratePitchingLoaders (node_modules/@nuxt/webpack/node_modules/loader-runner/lib/LoaderRunner.js:169:2)\r\n at runLoaders (node_modules/@nuxt/webpack/node_modules/loader-runner/lib/LoaderRunner.js:365:2)\r\n at NormalModule.doBuild (node_modules/@nuxt/webpack/node_modules/webpack/lib/NormalModule.js:295:3)\r\n at NormalModule.build (node_modules/@nuxt/webpack/node_modules/webpack/lib/NormalModule.js:446:15)\r\n at Compilation.buildModule (node_modules/@nuxt/webpack/node_modules/webpack/lib/Compilation.js:739:10)\r\n at node_modules/@nuxt/webpack/node_modules/webpack/lib/Compilation.js:981:14\r\n at node_modules/@nuxt/webpack/node_modules/webpack/lib/NormalModuleFactory.js:409:6\r\n at node_modules/@nuxt/webpack/node_modules/webpack/lib/NormalModuleFactory.js:155:13\r\n at AsyncSeriesWaterfallHook.eval [as callAsync] (eval at create (node_modules/tapable/lib/HookCodeFactory.js:33:10), \u003Canonymous>:6:1)\r\n at node_modules/@nuxt/webpack/node_modules/webpack/lib/NormalModuleFactory.js:138:29\r\n at node_modules/@nuxt/webpack/node_modules/webpack/lib/NormalModuleFactory.js:346:9\r\n @ ./.nuxt/t12hfdrq/App.js 28:0-50 30:32-41\r\n @ ./.nuxt/t12hfdrq/index.js\r\n @ ./.nuxt/t12hfdrq/client.js\r\n @ multi ./node_modules/@nuxt/components/lib/installComponents.js ./.nuxt/t12hfdrq/client.js\r\n```\r\nMy `jest.config.js`:\r\n\r\n```js\r\n/*\r\n * For a detailed explanation regarding each configuration property, visit:\r\n * https://jestjs.io/docs/configuration\r\n */\r\n\r\nmodule.exports = {\r\n clearMocks: true,\r\n collectCoverage: true,\r\n coverageDirectory: 'coverage',\r\n coverageProvider: 'v8',\r\n preset: '@nuxt/test-utils',\r\n transformIgnorePatterns: [\r\n 'node_modules/(?!(nuxt-i18n|@nuxtjs/vuetify|@nuxtjs/i18n|nuxt-highcharts)/)',\r\n ],\r\n setupFilesAfterEnv: ['./tests/setup.js'],\r\n moduleNameMapper: {\r\n '^@/(.)$': '\u003CrootDir>/$1',\r\n '^~/(.)$': '\u003CrootDir>/$1',\r\n '^./(.)$': '\u003CrootDir>/$1',\r\n '^vue$': 'vue/dist/vue.common.js',\r\n },\r\n}\r\n```\r\n\r\nMy `setup.js`:\r\n\r\n```js\r\nimport path from 'path'\r\nimport glob from 'glob'\r\nimport Vue from 'vue'\r\n\r\nglob.sync(path.join(__dirname, './components/**/*.vue')).forEach((file) => {\r\n const name = file.match(/(\\w*)\\.vue$/)[1]\r\n Vue.component(name, require(file).default)\r\n})\r\n\r\nglobal.Vue = Vue\r\n```\r\n\r\nI am using nuxt components with `components: true` in my `nuxt.config.js`.\r\n\r\nHere my `package.json`:\r\n\r\n```json\r\n{\r\n \"name\": \"ui\",\r\n \"version\": \"1.0.0\",\r\n \"private\": true,\r\n \"scripts\": {\r\n \"dev\": \"nuxt\",\r\n \"build\": \"nuxt build\",\r\n \"start\": \"nuxt start\",\r\n \"generate\": \"nuxt generate\",\r\n \"lint:js\": \"eslint --ext \\\".js,.vue\\\" --ignore-path .gitignore .\",\r\n \"lint:prettier\": \"prettier --check .\",\r\n \"lint\": \"yarn lint:js && yarn lint:prettier\",\r\n \"lintfix\": \"prettier --write --list-different . && yarn lint:js --fix\",\r\n \"test\": \"nuxt build && jest\"\r\n },\r\n \"dependencies\": {\r\n \"@nuxtjs/auth-next\": \"5.0.0-1648802546.c9880dc\",\r\n \"@nuxtjs/axios\": \"^5.13.6\",\r\n \"@nuxtjs/dayjs\": \"^1.4.1\",\r\n \"@nuxtjs/i18n\": \"^7.2.2\",\r\n \"@nuxtjs/pwa\": \"^3.3.5\",\r\n \"core-js\": \"^3.23.1\",\r\n \"nuxt\": \"^2.15.8\",\r\n \"nuxt-highcharts\": \"^2.0.4\",\r\n \"vue\": \"^2.6.14\",\r\n \"vue-server-renderer\": \"^2.6.14\",\r\n \"vue-template-compiler\": \"^2.6.14\",\r\n \"vued3tree\": \"^5.1.0\",\r\n \"vuetify\": \"^2.6.6\",\r\n \"vuetify-confirm\": \"^2.0.6\",\r\n \"vuetify-toast-snackbar-ng\": \"^0.7.5\",\r\n \"vuex\": \"^3.6.2\",\r\n \"webpack\": \"^5.73.0\"\r\n },\r\n \"devDependencies\": {\r\n \"@babel/eslint-parser\": \"^7.18.2\",\r\n \"@nuxt/test-utils\": \"^0.2.2\",\r\n \"@nuxtjs/eslint-config\": \"^10.0.0\",\r\n \"@nuxtjs/eslint-module\": \"^3.1.0\",\r\n \"@nuxtjs/vuetify\": \"^1.12.3\",\r\n \"eslint\": \"^8.18.0\",\r\n \"eslint-config-prettier\": \"^8.5.0\",\r\n \"eslint-plugin-nuxt\": \"^3.2.0\",\r\n \"eslint-plugin-vue\": \"^9.1.1\",\r\n \"glob\": \"^8.0.3\",\r\n \"jest\": \"^28.1.1\",\r\n \"playwright\": \"^1.22.2\",\r\n \"prettier\": \"^2.7.1\"\r\n }\r\n}\r\n```\r\n\r\nAny ideas?\r\n\r\nThank you very much for your help.",[3268],{"name":3269,"color":3270},"v0","4137F6","test-utils","Problem with components","2024-05-01T16:05:18Z","https://github.com/nuxt/test-utils/issues/315",["Reactive",3276],{},["Set"],["ShallowReactive",3279],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$fkyRfkSAipQsKSeNnWudcYzyh6VR3qtvKrIdiIn0LilA":-1},"/nuxt/test-utils/745"]