| \u003Cimg width=\"403\" alt=\"Image\" src=\"https://github.com/user-attachments/assets/de628eac-77c1-4994-9986-bdf53b5f3dad\" /> |\n\n## Reproduction\n\n- Stackblitz: https://stackblitz.com/edit/github-yzt752qo?file=nuxt.config.ts,tailwind.config.js\n\nApparently, it's not reproducible in Stackblitz: https://github.com/nuxt/fonts/issues/438#issuecomment-2560376071\n\nHopefully, the Stackblitz is enough to demonstrate the issue, thought.",[],578,"nuxt","fonts","open","Variation Settings not applied in variable fonts","2025-03-23T01:49:12Z","https://github.com/nuxt/fonts/issues/578",0.73585856,{"description":1993,"labels":1994,"number":1995,"owner":1985,"repository":1996,"state":1987,"title":1997,"updated_at":1998,"url":1999,"score":2000},"I added @nuxt/icon to my project. In the project it is working fine but in histoire it is not working.\r\nIn histoire it is not able to render the stories that contain components that use @nuxt/icon.\r\n\r\nOn devtools console you always see the error:\r\n\u003Cimg width=\"654\" alt=\"Bildschirmfoto 2024-07-22 um 21 10 24\" src=\"https://github.com/user-attachments/assets/4793e76d-e549-4712-bdfc-dc230c1cb56f\">\r\n\r\nit doesn't matter if mode is css or svg, it doesn't matter if from iconify icon libs, global components or custom collections, it is simple not able to work with it. The error is always the same.\r\n\r\nHere is a reproduction: https://stackblitz.com/edit/nuxt-starter-kckxy8\r\nrun the histoire to see the story not getting rendered and the console error in devtools.\r\n\r\nPlease help!",[],212,"icon","@nuxt/icon not working in histoire with mode \"svg\"","2024-08-11T05:45:02Z","https://github.com/nuxt/icon/issues/212",0.7490558,{"description":2002,"labels":2003,"number":2007,"owner":1985,"repository":2008,"state":1987,"title":2009,"updated_at":2010,"url":2011,"score":2012},"### 📚 What are you trying to do?\n\nWhen using the code, I get a center marker on the coordinates I want on the static map view, but as soon as the map gets active it disappears. The demo code in the docs, I don't see how it works since api is no longer worker. \n\n```\n\n\n\u003Cscript setup lang=\"ts\">\n import { ref } from \"vue\";\n import { useRuntimeConfig } from \"#app\";\n\n const config = useRuntimeConfig();\n const googleMapsApiKey = config.public.googleMapsApiKey;\n const leidenCoords = { lat: 52.160114, lng: 4.49701 }; // Coordinates for Leiden\n\n const mapOptions = {\n zoom: 10, // Set the initial zoom level\n center: { lat: 52.160114, lng: 4.49701 }, // Initial center position\n mapTypeControl: false, // Disables Map/Satellite option\n streetViewControl: false, // Disables Street View pegman\n fullscreenControl: false, // Disables fullscreen option\n scrollwheel: false, // Disables scroll wheel zoom\n styles: [\n {\n featureType: \"landscape\",\n stylers: [{ color: \"#f9ddc5\" }, { lightness: -7 }],\n },\n {\n featureType: \"road\",\n stylers: [{ color: \"#813033\" }, { lightness: 43 }],\n },\n {\n featureType: \"poi.business\",\n stylers: [{ color: \"#645c20\" }, { lightness: 38 }],\n },\n {\n featureType: \"water\",\n stylers: [\n { color: \"#1994bf\" },\n { saturation: -69 },\n { gamma: 0.99 },\n { lightness: 43 },\n ],\n },\n {\n featureType: \"road.local\",\n elementType: \"geometry.fill\",\n stylers: [\n { color: \"#f19f53\" },\n { weight: 1.3 },\n { visibility: \"on\" },\n { lightness: 16 },\n ],\n },\n { featureType: \"poi.business\" },\n {\n featureType: \"poi.park\",\n stylers: [{ color: \"#645c20\" }, { lightness: 39 }],\n },\n {\n featureType: \"poi.school\",\n stylers: [{ color: \"#a95521\" }, { lightness: 35 }],\n },\n {\n featureType: \"poi.medical\",\n elementType: \"geometry.fill\",\n stylers: [\n { color: \"#813033\" },\n { lightness: 38 },\n { visibility: \"off\" },\n ],\n },\n ],\n }; // Function to add the Leiden marker when map is ready\n\u003C/script>\n\n\u003Ctemplate>\n \u003Cdiv class=\"flex items-center justify-center w-full min-w-full\">\n \u003CScriptGoogleMaps\n :api-key=\"googleMapsApiKey\"\n :mapOptions=\"mapOptions\"\n class=\"h-64 rounded-lg min-w-full\"\n />\n \u003C/div>\n\u003C/template>\n\n\u003Cstyle scoped>\n /* Optional styling */\n\u003C/style>\n\n\u003Cstyle scoped>\n /* Ensure map has full width and fixed height */\n #map {\n width: 100%;\n height: 16rem; /* 64 Tailwind units */\n }\n\u003C/style>\n\n\n```\n\n\n\n\n### 🔍 What have you tried?\n\n_No response_\n\n### ℹ️ Additional context\n\n_No response_",[2004],{"name":2005,"color":2006},"help wanted","008672",314,"scripts","Centermarker disappears when loading active googlemap","2024-11-10T17:33:02Z","https://github.com/nuxt/scripts/issues/314",0.75515974,{"description":2014,"labels":2015,"number":2007,"owner":1985,"repository":2019,"state":1987,"title":2020,"updated_at":2021,"url":2022,"score":2012},"### Environment\n\n- Operating System: `Linux`\r\n- Node Version: `v16.14.2`\r\n- Nuxt Version: `3.0.0-rc.12`\r\n- Nitro Version: `0.6.0`\r\n- Package Manager: `npm@7.17.0`\r\n- Builder: `vite`\r\n- User Config: `-`\r\n- Runtime Modules: `-`\r\n- Build Modules: `-`\n\n### Reproduction\n\nhttps://stackblitz.com/edit/nuxt-framework-zehqm6\n\n### Describe the bug\n\nThe empty `await setup({})` in the tests takes ~4 seconds for every rerun in `watch` mode in the empty project.\r\nPlease, check the reproduction, try to run `npm test`.\n\n### Additional context\n\n_No response_\n\n### Logs\n\n_No response_",[2016],{"name":2017,"color":2018},"enhancement","a2eeef","test-utils","The \"setup\" in the tests is very slow for every rerun","2024-12-03T16:02:16Z","https://github.com/nuxt/test-utils/issues/314",{"description":2024,"labels":2025,"number":2032,"owner":1985,"repository":2033,"state":1987,"title":2034,"updated_at":2035,"url":2036,"score":2037},"### Description\n\nIt doesn't seem to apply using\n\ntailwind.config.js\n`export default {\n important: true \n}\n`",[2026,2029],{"name":2027,"color":2028},"question","d876e3",{"name":2030,"color":2031},"v3","49DCB8",3528,"ui","Is there a way to apply Tailwind Important Mode through Nuxt UI?","2025-03-14T22:49:40Z","https://github.com/nuxt/ui/issues/3528",0.77389026,{"description":2039,"labels":2040,"number":2048,"owner":1985,"repository":2033,"state":1987,"title":2049,"updated_at":2050,"url":2051,"score":2052},"### Reproduction\n\n````\n\u003Ctemplate>\n \u003CUChip text=\"test\" size=\"3xl\">\n \u003CUButton icon=\"i-lucide-mail\" color=\"neutral\" variant=\"subtle\" />\n \u003C/UChip>\n\u003C/template>\n````\n\n### Description\n\nHey,\n\nThanks for your great work.\n\nI have noticed this on a few elements in UI3, but especaily here padding just is not right. Yes of course you can change it, but i belive there needs to be some sane defaults across all elements.\n\nText in chip, and even a simple number is almost unreadable see screenshot below. Happy to open a pr or list all other elements where this seems to have happened (one that comes to mind is UAvatar https://github.com/nuxt/ui/issues/3558).\n\n\n\n### Additional context\n\nThis example is directly from the UI website",[2041,2044,2045],{"name":2042,"color":2043},"bug","d73a4a",{"name":2030,"color":2031},{"name":2046,"color":2047},"triage","ffffff",3633,"Default padding on `UChip`","2025-03-20T09:21:01Z","https://github.com/nuxt/ui/issues/3633",0.7761399,{"description":2054,"labels":2055,"number":2058,"owner":1985,"repository":2033,"state":1987,"title":2059,"updated_at":2060,"url":2061,"score":2062},"### Description\n\nhi\nafter i upgrade from v2 to v3 i get this error : \n\n[plugin:vite:vue] [@vue/compiler-sfc] Failed to resolve extends base type.\nIf this previously worked in 3.2, you can instruct the compiler to ignore this extend by adding /* @vue-ignore */ before it, for example:\n\ninterface Props extends /* @vue-ignore */ Base {}\n\nNote: both in 3.2 or with the ignore, the properties in the base type are treated as fallthrough attrs at runtime.\n\n/node_modules/@nuxt/ui/dist/runtime/components/Carousel.vue\n151| const appConfig = useAppConfig()\n152| const { dir, t } = useLocale()\n153| const rootProps = useForwardProps(reactivePick(props, 'active', 'align', 'breakpoints', 'containScroll', 'dragFree', 'dragThreshold', 'duration', 'inViewThreshold', 'loop', 'skipSnaps', 'slidesToScroll', 'startIndex', 'watchDrag', 'watchResize', 'watchSlides', 'watchFocus'))\n | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^\n154| \n155| const prevIcon = computed(() => props.prevIcon || (dir.value === 'rtl' ? appConfig.ui.icons.arrowRight : appConfig.ui.icons.arrowLeft))\n\n\ncan anyone help me ?",[2056,2057],{"name":2027,"color":2028},{"name":2030,"color":2031},3873,"[@vue/compiler-sfc] Failed to resolve extends base type.","2025-04-13T06:59:01Z","https://github.com/nuxt/ui/issues/3873",0.78101003,{"description":2064,"labels":2065,"number":2074,"owner":1985,"repository":1985,"state":2075,"title":2076,"updated_at":2077,"url":2078,"score":2079},"In Nuxt 3, we have introduced a new package `@nuxt/schema` that holds types, defaults, and documentation for all build-in configurations for Nuxt and from one source using [untyped](https://github.com/unjs/untyped). In comparation with Nuxt 2, these were separately maintained, often with inconsistencies. This new system is also designed to be future proof to be able to **manage configuration via UI** using generated (JSON)Schema files and also **runtime validation** to notice any usage issues.\r\n\r\nFor Nuxt modules, it is already possible to extend a typescript interface `ModuleOptions` to provide types, however it has same limitations of Nuxt 2 era. We have introduced new `schema` in new `@nuxt/kit` module definition system however it became unused.\r\n\r\nWith the introduction of Nuxt Layers, themes can also now require some specific configuration. Most importantly for configuring `runtimeConfig` and app config (either via `appConfig` or `app.config`)\r\n\r\nFor this, we can use the same tooling (untyped) as a built-in feature to allow providing custom configuration schemas from Nuxt layers and modules (also directly from a Nuxt project). Benefiting from most possibilities (note 1) we have already for core config.\r\n\r\nWe have made an experiment [nuxt-experiments/nuxt-config-schema](https://github.com/nuxt-experiments/nuxt-config-schema) that is now almost ready to be moved into a core experiment, allowing to make it better usable. It is possible to provide custom config schema for nuxt projects in different ways:\r\n\r\n- Using `nuxt.schema.ts` in main Nuxt project or a layer\r\n- Using `$schema` key in `nuxt.config`\r\n- Extend `nuxt.options.$schema` for modules\r\n- Extend schema using `schema:extend`, `schema:resolved` and `schema:beforeWrite` for modules (note 2)\r\n- Use `schema` in `defineNuxtModule` (recommended way for modules. also supports defaults)\r\n\r\nThe output will be in `.nuxt` directory and initially mainly usable for the Augmentation of types and custom purposes such as UI.\r\n\r\n\r\n**Notes:**\r\n\r\nnote 1: Since development and trial of the experimental module, one particularly important point we found is that, unlike the core usage, mixing schema with defaults is not a good practice. We can only merge schema after modules are setup and it is too late for them to **re**apply new defaults and do their config handling logic and also it makes it much harder to merge runtime configuration such as `app.config` since custom merger logic resides in runtime while schema is in the build-time namespace and merging strategy is different.\r\n\r\nnote 2: We have introduced two separate hooks. `extend`/`resolve` as main way to extend schema just after all modules are initialized and before core or any other place tries to use schema and another `beforeWrite` as last resort (less recommended) for when a module needs to extend schema based on build aftertifacts coming from webpack, rollup or nitro's rollup step and it mainly and only affects the written files.\r\n\r\n\r\n\r\n\r\n\r\n",[2066,2068,2071],{"name":2017,"color":2067},"8DEF37",{"name":2069,"color":2070},"discussion","538de2",{"name":2072,"color":2073},"3.x","29bc7f",15592,"closed","Custom config schema","2023-04-07T01:47:49Z","https://github.com/nuxt/nuxt/issues/15592",0.73881155,{"description":2081,"labels":2082,"number":1995,"owner":1985,"repository":2008,"state":2075,"title":2087,"updated_at":2088,"url":2089,"score":2000},"### 🐛 The bug\r\n\r\nAlso shown in the video below from 00:06 on (before just a sanity check that it works).\r\n\r\n1. Go to https://nuxt.com/blog/nuxt-scripts\r\n2. Scroll to the YouTube example\r\n3. DO NOT click the video yet\r\n4. Click on \"input\"\r\n5. Click on \"output\" again\r\n6. Try to play the video\r\n7. See that it doesn't work\r\n\r\n\r\n[nuxt-blog-scripts.webm](https://github.com/user-attachments/assets/d92655a4-6c95-495d-b33c-35797a180e7e)\r\n\r\n\r\n### 🛠️ To reproduce\r\n\r\nhttps://nuxt.com/blog/nuxt-scripts\r\n\r\n### 🌈 Expected behavior\r\n\r\nThe video should be loaded after the click too\r\n\r\n### ℹ️ Additional context\r\n\r\n_No response_",[2083,2084],{"name":2042,"color":2043},{"name":2085,"color":2086},"upstream","84A80F","Blog: Example does not work after tab switch","2024-09-03T05:51:31Z","https://github.com/nuxt/scripts/issues/212",{"description":2091,"labels":2092,"number":2007,"owner":1985,"repository":1986,"state":2075,"title":2093,"updated_at":2094,"url":2095,"score":2012},"I'm trying to load two different fonts from Adobe Fonts and it only loads one.\n\nThe fonts I'm trying to use:\n- Transducer\n- Articulat CF\n\nArticulat CF does load but Transducer doesn't.\n\nHere is my `nuxt.config.ts`:\n```js\nexport default defineNuxtConfig({\n compatibilityDate: '2024-04-03',\n devtools: { \n enabled: true \n },\n modules: [\n '@nuxtjs/tailwindcss',\n 'nuxt-svgo',\n '@nuxt/fonts',\n ],\n fonts: {\n adobe: {\n id: ['ztp5pvp'],\n },\n families: [\n { name: '\"Articulat CF\"', provider: 'adobe' },\n { name: '\"Transducer\"', provider: 'adobe' },\n ],\n },\n app: {\n //\n }\n})\n```\n\nHere is my `tailwind.config.js`:\n```js\nmodule.exports = {\n theme: {\n extend: {\n colors: {\n 'brand-primary': '#5122E1',\n },\n fontFamily: {\n transducer: ['\"Transducer\"', 'system-ui', 'sans-serif'],\n articulat: ['\"Articulat CF\"', 'system-ui', 'sans-serif'],\n },\n typography: {\n DEFAULT: {\n css: {\n 'blockquote p:first-of-type::before': false,\n 'blockquote p:first-of-type::after': false,\n },\n },\n },\n },\n },\n variants: {\n extend: {\n order: ['odd', 'even'],\n marginBottom: ['last'],\n }\n },\n plugins: [\n require('@tailwindcss/typography'),\n require('@tailwindcss/forms'),\n ],\n}\n```\n\nHere's a screenshot for my Abode Font kit\n\n\nThis is the Adobe Fonts CSS: https://use.typekit.net/ztp5pvp.css.\n\nI know you can't use the `'articulat-cf'` lowercase format, so I've tried `'\"Transducer\"'`, `'Transducer'`, `'\"transducer\"'`, and `\"transducer\"` formats both in `nuxt.config.ts` and `tailwind.config.js` which never loads that font, but loads and displays `\"Articulat CF\"` fine.\n\nAm I missing something here?\n\nThanks.",[],"Issue loading certain fonts with Adobe Fonts (Typekit)","2024-10-07T11:17:21Z","https://github.com/nuxt/fonts/issues/314",["Reactive",2097],{},["Set"],["ShallowReactive",2100],{"TRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"2yzeWRgxmbm1U7ISMMKHF1E7zPZq4xq67n6Grhdt9Cg":-1},"/nuxt/icon/275"]