{"record":{"id":"00fed7f92f853b08","repo":"vuetifyjs/vuetify","slug":"vuetify-vwindowitem-must-be-used-inside-vwindow","errorCode":null,"errorMessage":"[Vuetify] VWindowItem must be used inside VWindow","messagePattern":"\\[Vuetify\\] VWindowItem must be used inside VWindow","errorType":"exception","errorClass":"Error","httpStatus":null,"severity":"error","filePath":"packages/vuetify/src/components/VWindow/VWindowItem.tsx","lineNumber":49,"sourceCode":"}, 'VWindowItem')\n\nexport const VWindowItem = genericComponent()({\n  name: 'VWindowItem',\n\n  directives: { vTouch },\n\n  props: makeVWindowItemProps(),\n\n  emits: {\n    'group:selected': (val: { value: boolean }) => true,\n  },\n\n  setup (props, { slots }) {\n    const window = inject(VWindowSymbol)\n    const groupItem = useGroupItem(props, VWindowGroupSymbol)\n    const { isBooted } = useSsrBoot()\n\n    if (!window || !groupItem) throw new Error('[Vuetify] VWindowItem must be used inside VWindow')\n\n    const isTransitioning = shallowRef(false)\n    const hasTransition = computed(() => isBooted.value && (\n      window.isReversed.value\n        ? props.reverseTransition !== false\n        : props.transition !== false\n    ))\n\n    function onAfterTransition () {\n      if (!isTransitioning.value || !window) {\n        return\n      }\n\n      // Finalize transition state.\n      isTransitioning.value = false\n      if (window.transitionCount.value > 0) {\n        window.transitionCount.value -= 1\n","sourceCodeStart":31,"sourceCodeEnd":67,"githubUrl":"https://github.com/vuetifyjs/vuetify/blob/8d153908dffb7592eb389ddbfbab955a0ccc977f/packages/vuetify/src/components/VWindow/VWindowItem.tsx#L31-L67","documentation":"VWindowItem injects VWindowSymbol and also calls useGroupItem for VWindowGroupSymbol. It throws when either is missing, i.e. <v-window-item> is rendered outside <v-window>, because the item needs the window's transition/reverse/booted state and its group registration.","triggerScenarios":"Rendering <v-window-item> outside <v-window>; teleporting it out of the window tree; testing it alone.","commonSituations":"Building a custom stepper/carousel and forgetting the <v-window> wrapper; copy-paste of a window item; refactoring that detaches the item.","solutions":["Nest <v-window-item> inside <v-window>.","Keep teleported items within the window provide tree.","Wrap the item in <v-window> for tests."],"exampleFix":"// before\n<v-window-item>Step</v-window-item>\n\n// after\n<v-window>\n  <v-window-item>Step</v-window-item>\n</v-window>","handlingStrategy":"type-guard","validationCode":"import { inject } from 'vue'\nimport { VWindowSymbol } from 'vuetify'\nconst win = inject(VWindowSymbol, null)\nif (!win) {\n  // not inside <v-window>: render plain content without window transitions\n}","typeGuard":"import { inject } from 'vue'\nimport { VWindowSymbol } from 'vuetify'\nexport function isInsideWindow (): boolean {\n  return inject(VWindowSymbol, null) != null\n}","tryCatchPattern":null,"preventionTips":["Always nest <v-window-item> inside <v-window>.","Do not teleport items outside the window tree.","Wrap items in <v-window> for tests."],"tags":["injection","window","components"],"backgroundTag":null,"analyzedSha":"8d153908dffb7592eb389ddbfbab955a0ccc977f","analyzedAt":"2026-08-12T21:54:20.596Z","schemaVersion":2},"datasetVersion":"2026-08-12T23:17:12.415Z"}