\n\u003C/template>\n```\n\n### Description\n\nWhen using the `USlider` component to render more than 100 `SliderThumbs`, the following error occurs:\n\n```\nUncaught (in promise) Maximum recursive updates exceeded in component \u003CSliderThumb>.\n```\n\nThis error seems to happen due to recursive reactive updates when the number of slider thumbs exceeds a certain limit.\n\n**Steps to Reproduce:**\n\n1. Create a Nuxt 3 project.\n2. Install Nuxt UI 3.\n3. Add the following code to a component:\n\n```vue\n\u003Cscript setup lang=\"ts\">\nimport { range } from 'lodash';\nimport { ref } from 'vue';\n\nconst value = ref(range(100)); // 100 sliders\n\u003C/script>\n\n\u003Ctemplate>\n \u003CUSlider v-model=\"value\" />\n\u003C/template>\n```\n\n4. Run the project and attempt to render the component.\n\n**Expected Result:**\nThe `USlider` component should render more than 100 `SliderThumbs` without any errors.\n\n**Actual Result:**\nThe following error is shown in the browser console, and the application fails to work properly:\n\n```\nUncaught (in promise) Maximum recursive updates exceeded in component \u003CSliderThumb>.\n```\n\n### Additional context\n\n- This issue seems to be caused by recursive reactive updates within the `USlider` component.\n- No documented limitations regarding the number of `SliderThumbs` were found in the Nuxt UI 3 documentation.\n\n### Logs\n\n```shell-script\n\n```",[1995,1998,2001],{"name":1996,"color":1997},"bug","d73a4a",{"name":1999,"color":2000},"v3","49DCB8",{"name":2002,"color":2003},"triage","ffffff",3174,"ui","`USlider`: Maximum recursive updates exceeded with more than 100 SliderThumbs","2025-01-25T10:51:38Z","https://github.com/nuxt/ui/issues/3174",0.7688756,{"description":2011,"labels":2012,"number":2015,"owner":1985,"repository":2016,"state":2017,"title":2018,"updated_at":2019,"url":2020,"score":2021},"https://volta.s3.fr-par.scw.cloud/Screenshot_2022_06_30_at_14_48_35_385aaa3ce8.mp4\n",[2013],{"name":1996,"color":2014},"ff281a",742,"nuxt.com","closed","[Editor] Emojis are adding a line break","2023-06-06T12:14:57Z","https://github.com/nuxt/nuxt.com/issues/742",0.4540328,{"description":2023,"labels":2024,"number":2028,"owner":1985,"repository":2005,"state":2017,"title":2029,"updated_at":2030,"url":2031,"score":2032},"### Description\n\nEmpty value for UInput with type number sets an empty string to the model. This results in a type error instead of a required error for validation. It makes me, and probably the end users, confused. Can this be somehow resolved?\r\n\r\n\u003Cimg width=\"366\" alt=\"image\" src=\"https://github.com/user-attachments/assets/0d9cf5a3-c439-49c8-9de6-e3c34dbdeb8c\">\r\n",[2025],{"name":2026,"color":2027},"question","d876e3",2090,"empty value for UInput with type number ","2025-03-28T17:30:59Z","https://github.com/nuxt/ui/issues/2090",0.7531874,{"description":2034,"labels":2035,"number":2037,"owner":1985,"repository":2016,"state":2017,"title":2038,"updated_at":2039,"url":2040,"score":2041},"Screenshot:\r\n\r\n",[2036],{"name":1996,"color":2014},1011,"Docs: Bug with syntax highlighting (caused by ')","2023-10-10T14:45:31Z","https://github.com/nuxt/nuxt.com/issues/1011",0.75667995,{"description":2043,"labels":2044,"number":2048,"owner":1985,"repository":2049,"state":2017,"title":2050,"updated_at":2051,"url":2052,"score":2053},"Hi! I've got a misterious problem with nuxt/fonts\nSometimes when deploy I get this kind of error (5 times out of 15 deploys)\n\nThat's not a versel bug, I've tried to run locally `npm run build` about 20 itmes and 5 of them ended up with the same error. \n\nMy configuration:\n\n `\"@nuxt/fonts\": \"0.10.2\"`\n`\"nuxt\": \"3.13.2\",`\n ```export default defineNuxtConfig({\n components: [\n {\n path: \"~/components\",\n global: true,\n },\n ],\n\n devtools: { enabled: false },\n\n css: [\"~/assets/styles/_global.scss\"],\n\n modules: [\n \"@nuxt/fonts\",\n \"nuxt-icons\",\n \"@nuxt/eslint\",\n \"nuxt-quasar-ui\",\n \"@pinia/nuxt\",\n \"@nuxtjs/device\",\n \"@nuxt/image\",\n \"@nuxtjs/seo\",\n \"@nuxtjs/robots\",\n \"nuxt-schema-org\",\n \"nuxt-link-checker\",\n \"@nuxtjs/sitemap\",\n \"nuxt-seo-experiments\",\n \"@nuxtjs/i18n\",\n \"@nuxt/scripts\",\n ],\n\n plugins: [\n \"~/plugins/rest-api.js\",\n { src: \"~/plugins/sentry.ts\", mode: \"client\" },\n { src: \"~/plugins/error-handler.ts\", mode: \"client\" },\n { src: \"~/plugins/image-error.ts\", mode: \"client\" },\n ],\n\n // scripts\n $production: {\n },\n\n $development: {\n },\n\n //SEO\n sitemap: {\n enabled: true,\n urls: async () => await getSiteMap(),\n defaults: {\n changefreq: \"daily\",\n priority: 1,\n lastmod: new Date(),\n },\n },\n robots: {\n enabled: true,\n disallow: [\"/admin\", \"/ui-kit\", \"/profile\", \"/third-party-auth\"],\n allow: \"/\",\n },\n ogImage: {\n enabled: false,\n },\n schemaOrg: {\n enabled: true,\n identity: {\n },\n defaults: false,\n reactive: true,\n },\n seo: {\n automaticDefaults: false,\n fallbackTitle: false,\n },\n linkChecker: {\n enabled: true,\n },\n seoExperiments: {\n enabled: true,\n },\n\n site: {\n\n },\n\n app: {\n head: {\n },\n },\n //SEO\n\n //images\n image: {\n format: [\"webp\", \"png\", \"svg\"],\n },\n //images\n\n //langs\n i18n: {\n legacy: false,\n locales: [\n {\n code: \"en\",\n name: \"English\",\n iso: \"en-US\",\n file: \"en.json\",\n },\n {\n code: \"de\",\n name: \"Deutsch\",\n iso: \"de-DE\",\n file: \"de.json\",\n },\n ],\n messages: {\n en: {},\n },\n defaultLocale: \"en\",\n strategy: \"prefix_except_default\",\n lazy: true,\n langDir: \"locales/\",\n detectBrowserLanguage: {\n useCookie: true,\n cookieKey: \"i18n_redirected\",\n alwaysRedirect: true,\n fallbackLocale: \"en\",\n },\n },\n //langs\n\n //vite\n vite: {\n css: {\n preprocessorOptions: {\n scss: {\n additionalData: '@use \"~/assets/styles/variables/_mixins.scss\" as *;',\n },\n },\n },\n build: {\n sourcemap: true,\n rollupOptions: {\n output: {\n // manualChunks: undefined,\n },\n },\n // cssCodeSplit: false,\n },\n\n plugins: [\n sentryVitePlugin({\n }),\n ],\n },\n //vite\n\n //ui\n quasar: {\n lang: \"ru\",\n plugins: [\"Dialog\", \"Notify\", \"Loading\", \"AppVisibility\"],\n },\n //ui\n\n //env\n runtimeConfig: {\n devtools: {\n enabled: true,\n },\n public: {\n },\n },\n //env\n\n //nitro\n nitro: {\n prerender: {\n // crawlLinks: true,\n routes: [\"/sitemap.xml\", \"/robots.txt\"],\n },\n compressPublicAssets: true,\n },\n //nitro\n\n //prerender\n routeRules: {\n },\n //prerender\n\n router: {\n options: {\n scrollBehaviorType: \"smooth\",\n },\n },\n\n //build\n build: {\n analyze: true,\n },\n\n //build\n\n //hooks\n hooks: {\n // \"build:before\": () => {\n // console.log(\"Running ESLint...\");\n // try {\n // execSync(\"pnpm run lint\", { stdio: \"inherit\" });\n // } catch (error) {\n // console.error(\"ESLint found issues\");\n // }\n // },\n },\n //hooks\n\n //other\n typescript: {\n strict: true,\n },\n ssr: false,\n compatibilityDate: \"2024-11-10\",\n //other\n});\n```\n----------\n```\n.dm-sans {\n font-family: \"DM Sans\", sans-serif;\n font-optical-sizing: auto;\n font-weight: normal;\n font-style: normal;\n}\n\n@font-face {\n font-family: \"Cabinet Grotesk\";\n src: url(\"~/assets/fonts/CabinetGrotesk-Bold.ttf\") format(\"truetype\");\n font-weight: 700;\n}\n\n@font-face {\n font-family: \"Cabinet Grotesk\";\n src: url(\"~/assets/fonts/CabinetGrotesk-Regular.ttf\") format(\"truetype\");\n font-weight: 400;\n}\n@font-face {\n font-family: \"DM Sans\";\n src: url(\"~/assets/fonts/DMSans-Bold.ttf\") format(\"truetype\");\n font-weight: 700;\n}\n\n@font-face {\n font-family: \"DM Sans\";\n src: url(\"~/assets/fonts/DMSans-Regular.ttf\") format(\"truetype\");\n font-weight: 400;\n}\n\n.cabinet-grotesk {\n font-family: \"Cabinet Grotesk\", sans-serif;\n font-optical-sizing: auto;\n font-weight: normal;\n font-style: normal;\n}\n```\n\nIs there any one with the similar problem? \n\n",[2045],{"name":2046,"color":2047},"duplicate","cfd3d7",408,"fonts","Family injection fetch failed","2024-12-05T02:26:06Z","https://github.com/nuxt/fonts/issues/408",0.7595439,{"description":2055,"labels":2056,"number":2058,"owner":1985,"repository":2016,"state":2017,"title":2059,"updated_at":2060,"url":2061,"score":2062},"\n",[2057],{"name":1996,"color":2014},1171,"[BlogArticle]- add space between date and author and fix hydration warnings","2023-02-15T12:31:13Z","https://github.com/nuxt/nuxt.com/issues/1171",0.76214993,{"description":2064,"labels":2065,"number":2069,"owner":1985,"repository":2005,"state":2017,"title":2070,"updated_at":2071,"url":2072,"score":2073},"### Environment\n\n- Operating System: Windows 10 \n- Node Version: v22.10.0 \n- Nuxt Version: 3.16.0 \n- CLI Version: 3.22.5 \n- Nitro Version: 2.11.5 \n- Package Manager: pnpm@9.15.7 \n- Builder: -\n- User Config: compatibilityDate, devtools, modules, css, meta, ssr, runtimeConfig, ui \n- Runtime Modules: @nuxt/ui@3.0.0-beta.3, @nuxt/icon@1.10.3, @nuxt/fonts@0.11.0, @vueuse/nuxt@12.8.2\n\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\nNuxt UI 3.0\n\n### Reproduction\n\n```\n\u003Ctemplate>\n\u003CUInput\n v-model=\"translation\"\n ref=\"translationField\" \n />\n\u003C/template>\n\n\u003Cscript setup>\nconst translationField = ref(null)\n\nfunction nextCard() {\n translationField.value.focus() // throws: 'focus is not a function'\n \n nextTick(() => {\n translationField.value.focus() // same error\n })\n\n // below works ok\n nextTick(() => {\n const input = translationField.value?.$el?.querySelector('input')\n if (input) {\n input.focus()\n }\n })\n}\n\u003C/script>\n```\n\n\n### Description\nStandard Vue method of using template ref (for setting a focus, here) throws: 'focus() is not a function'\nIn the above code snippet I included workaround (credits to Sonnet 3.5)\nTried it dozen of times and checked this place to see if it has not been solved earlier.\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[2066,2067,2068],{"name":1996,"color":1997},{"name":1999,"color":2000},{"name":2002,"color":2003},3644,"\u003CUInput> template ref does not work","2025-03-21T13:14:18Z","https://github.com/nuxt/ui/issues/3644",0.7631346,{"labels":2075,"number":2079,"owner":1985,"repository":1985,"state":2017,"title":2080,"updated_at":2081,"url":2082,"score":2083},[2076],{"name":2077,"color":2078},"2.x","d4c5f9",6551,"add new favicon","2023-01-18T21:49:16Z","https://github.com/nuxt/nuxt/issues/6551",0.7633013,{"description":2085,"labels":2086,"number":2088,"owner":1985,"repository":2016,"state":2017,"title":2089,"updated_at":2090,"url":2091,"score":2092},"\n",[2087],{"name":1996,"color":2014},50,"TeamsDropdown: No ellipsis on team label and avatar placeholder","2023-02-15T12:30:32Z","https://github.com/nuxt/nuxt.com/issues/50",0.76367295,["Reactive",2094],{},["Set"],["ShallowReactive",2097],{"TRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"8eNNzgEW-jwuqcVVSjUTV4fYdf12ZCsV6JXeciEyn8I":-1},"/nuxt/test-utils/742"]