qwikifiers · thejackshelton-kunaico · Mar 10, 2025 · Mar 10, 2025 · Mar 10, 2025 · Mar 10, 2025
diff --git a/apps/component-tests/README.md b/apps/component-tests/README.md
@@ -10,7 +10,7 @@
 
 ## Project Structure
 
-This project is using Qwik with [QwikCity](https://qwik.builder.io/qwikcity/overview/). QwikCity is just a extra set of tools on top of Qwik to make it easier to build a full site, including directory-based routing, layouts, and more.
+This project is using Qwik with [QwikCity](https://qwik.qwik.dev/corecity/overview/). QwikCity is just a extra set of tools on top of Qwik to make it easier to build a full site, including directory-based routing, layouts, and more.
 
 Inside your project, you'll see the following directory structure:
 
@@ -24,15 +24,15 @@ Inside your project, you'll see the following directory structure:
         └── ...
 ```
 
-- `src/routes`: Provides the directory based routing, which can include a hierarchy of `layout.tsx` layout files, and an `index.tsx` file as the page. Additionally, `index.ts` files are endpoints. Please see the [routing docs](https://qwik.builder.io/qwikcity/routing/overview/) for more info.
+- `src/routes`: Provides the directory based routing, which can include a hierarchy of `layout.tsx` layout files, and an `index.tsx` file as the page. Additionally, `index.ts` files are endpoints. Please see the [routing docs](https://qwik.qwik.dev/corecity/routing/overview/) for more info.
 
 - `src/components`: Recommended directory for components.
 
 - `public`: Any static assets, like images, can be placed in the public directory. Please see the [Vite public directory](https://vitejs.dev/guide/assets.html#the-public-directory) for more info.
 
 ## Add Integrations and deployment
 
-Use the `pnpm qwik add` command to add additional integrations. Some examples of integrations include: Cloudflare, Netlify or Express server, and the [Static Site Generator (SSG)](https://qwik.builder.io/qwikcity/static-site-generation/static-site-config/).
+Use the `pnpm qwik add` command to add additional integrations. Some examples of integrations include: Cloudflare, Netlify or Express server, and the [Static Site Generator (SSG)](https://qwik.qwik.dev/corecity/static-site-generation/static-site-config/).
 
 ```shell
 pnpm qwik add # or `yarn qwik add`

diff --git a/apps/component-tests/src/components/router-head/router-head.tsx b/apps/component-tests/src/components/router-head/router-head.tsx
@@ -1,5 +1,5 @@
-import { component$ } from '@builder.io/qwik';
-import { useDocumentHead, useLocation } from '@builder.io/qwik-city';
+import { component$ } from '@qwik.dev/core';
+import { useDocumentHead, useLocation } from '@qwik.dev/router';
 
 /**
  * The RouterHead component is placed inside of the document `<head>` element.

diff --git a/apps/component-tests/src/components/showcase-test/showcase-test.tsx b/apps/component-tests/src/components/showcase-test/showcase-test.tsx
@@ -1,6 +1,6 @@
-import { Component, component$, useSignal, useTask$ } from '@builder.io/qwik';
-import { useLocation } from '@builder.io/qwik-city';
-import { isDev } from '@builder.io/qwik/build';
+import { Component, component$, useSignal, useTask$ } from '@qwik.dev/core';
+import { useLocation } from '@qwik.dev/router';
+import { isDev } from '@qwik.dev/core/build';
 import { metaGlobComponents } from './component-imports';
 
 export const ShowcaseTest = component$(() => {

diff --git a/apps/component-tests/src/entry.dev.tsx b/apps/component-tests/src/entry.dev.tsx
@@ -9,7 +9,7 @@
  * - More code is transferred to the browser than in SSR mode.
  * - Optimizer/Serialization/Deserialization code is not exercised!
  */
-import { render, RenderOptions } from '@builder.io/qwik';
+import { render, RenderOptions } from '@qwik.dev/core';
 import Root from './root';
 
 export default function (opts: RenderOptions) {

diff --git a/apps/component-tests/src/entry.preview.tsx b/apps/component-tests/src/entry.preview.tsx
@@ -10,7 +10,7 @@
  * - https://vitejs.dev/config/preview-options.html#preview-options
  *
  */
-import { createQwikCity } from '@builder.io/qwik-city/middleware/node';
+import { createQwikCity } from '@qwik.dev/router/middleware/node';
 // The `render` import must stay after `qwikCityPlan` import: https://github.com/BuilderIO/qwik/issues/3634
 import qwikCityPlan from '@qwik-city-plan';
 import render from './entry.ssr';

diff --git a/apps/component-tests/src/entry.ssr.tsx b/apps/component-tests/src/entry.ssr.tsx
@@ -10,7 +10,7 @@
  * - npm run build
  *
  */
-import { renderToStream, RenderToStreamOptions } from '@builder.io/qwik/server';
+import { renderToStream, RenderToStreamOptions } from '@qwik.dev/core/server';
 import { manifest } from '@qwik-client-manifest';
 import Root from './root';
 

diff --git a/apps/component-tests/src/root.tsx b/apps/component-tests/src/root.tsx
@@ -1,5 +1,5 @@
-import { component$, useStyles$ } from '@builder.io/qwik';
-import { QwikCityProvider, RouterOutlet } from '@builder.io/qwik-city';
+import { component$, useStyles$ } from '@qwik.dev/core';
+import { QwikRouterProvider, RouterOutlet } from '@qwik.dev/router';
 
 import { RouterHead } from './components/router-head/router-head';
 import globalStyles from './global.css?inline';
@@ -25,7 +25,7 @@ export default component$(() => {
   useStyles$(globalStyles);
 
   return (
-    <QwikCityProvider>
+    <QwikRouterProvider>
       <head>
         <meta charset="utf-8" />
         <link rel="manifest" href="/manifest.json" />
@@ -47,6 +47,6 @@ export default component$(() => {
           <RouterOutlet />
         </ThemeProvider>
       </body>
-    </QwikCityProvider>
+    </QwikRouterProvider>
   );
 });
diff --git a/apps/component-tests/src/routes/[kit]/[component]/[example]/index.tsx b/apps/component-tests/src/routes/[kit]/[component]/[example]/index.tsx
@@ -1,4 +1,4 @@
-import { component$ } from '@builder.io/qwik';
+import { component$ } from '@qwik.dev/core';
 import { ShowcaseTest } from '../../../../components/showcase-test/showcase-test';
 
 export default component$(() => {

diff --git a/apps/component-tests/src/routes/index.tsx b/apps/component-tests/src/routes/index.tsx
@@ -1,5 +1,5 @@
-import { component$ } from '@builder.io/qwik';
-import type { DocumentHead } from '@builder.io/qwik-city';
+import { component$ } from '@qwik.dev/core';
+import type { DocumentHead } from '@qwik.dev/router';
 
 export default component$(() => {
   return <div>kit/component/example</div>;

diff --git a/apps/component-tests/src/routes/service-worker.ts b/apps/component-tests/src/routes/service-worker.ts
@@ -2,12 +2,12 @@
  * WHAT IS THIS FILE?
  *
  * The service-worker.ts file is used to have state of the art prefetching.
- * https://qwik.builder.io/qwikcity/prefetching/overview/
+ * https://qwik.qwik.dev/corecity/prefetching/overview/
  *
  * Qwik uses a service worker to speed up your site and reduce latency, ie, not used in the traditional way of offline.
  * You can also use this file to add more functionality that runs in the service worker.
  */
-import { setupServiceWorker } from '@builder.io/qwik-city/service-worker';
+import { setupServiceWorker } from '@qwik.dev/router/service-worker';
 
 setupServiceWorker();
 

diff --git a/apps/component-tests/tsconfig.json b/apps/component-tests/tsconfig.json
@@ -6,7 +6,7 @@
     "module": "ES2022",
     "lib": ["es2022", "DOM", "WebWorker", "DOM.Iterable"],
     "jsx": "react-jsx",
-    "jsxImportSource": "@builder.io/qwik",
+    "jsxImportSource": "@qwik.dev/core",
     "strict": true,
     "resolveJsonModule": true,
     "moduleResolution": "node",

diff --git a/apps/component-tests/vite.config.ts b/apps/component-tests/vite.config.ts
@@ -1,12 +1,12 @@
-import { qwikVite } from '@builder.io/qwik/optimizer';
-import { qwikCity } from '@builder.io/qwik-city/vite';
+import { qwikVite } from '@qwik.dev/core/optimizer';
+import { qwikRouter } from '@qwik.dev/router/vite';
 import { defineConfig } from 'vite';
 import tsconfigPaths from 'vite-tsconfig-paths';
 
 export default defineConfig({
   cacheDir: '../../node_modules/.vite/apps/component-tests',
   plugins: [
-    qwikCity(),
+    qwikRouter(),
     qwikVite({
       client: {
         outDir: '../../dist/apps/component-tests/client',

diff --git a/apps/website/README.md b/apps/website/README.md
@@ -10,7 +10,7 @@
 
 ## Project Structure
 
-This project is using Qwik with [QwikCity](https://qwik.builder.io/qwikcity/overview/). QwikCity is just a extra set of tools on top of Qwik to make it easier to build a full site, including directory-based routing, layouts, and more.
+This project is using Qwik with [QwikCity](https://qwik.qwik.dev/corecity/overview/). QwikCity is just a extra set of tools on top of Qwik to make it easier to build a full site, including directory-based routing, layouts, and more.
 
 Inside your project, you'll see the following directory structure:
 
@@ -24,15 +24,15 @@ Inside your project, you'll see the following directory structure:
         └── ...
 ```
 
-- `src/routes`: Provides the directory based routing, which can include a hierarchy of `layout.tsx` layout files, and an `index.tsx` file as the page. Additionally, `index.ts` files are endpoints. Please see the [routing docs](https://qwik.builder.io/qwikcity/routing/overview/) for more info.
+- `src/routes`: Provides the directory based routing, which can include a hierarchy of `layout.tsx` layout files, and an `index.tsx` file as the page. Additionally, `index.ts` files are endpoints. Please see the [routing docs](https://qwik.qwik.dev/corecity/routing/overview/) for more info.
 
 - `src/components`: Recommended directory for components.
 
 - `public`: Any static assets, like images, can be placed in the public directory. Please see the [Vite public directory](https://vitejs.dev/guide/assets.html#the-public-directory) for more info.
 
 ## Add Integrations and deployment
 
-Use the `pnpm qwik add` command to add additional integrations. Some examples of integrations include: Cloudflare, Netlify or Express server, and the [Static Site Generator (SSG)](https://qwik.builder.io/qwikcity/static-site-generation/static-site-config/).
+Use the `pnpm qwik add` command to add additional integrations. Some examples of integrations include: Cloudflare, Netlify or Express server, and the [Static Site Generator (SSG)](https://qwik.qwik.dev/corecity/static-site-generation/static-site-config/).
 
 ```shell
 pnpm qwik add # or `pnpm qwik add`

diff --git a/apps/website/adapters/static/vite.config.ts b/apps/website/adapters/static/vite.config.ts
@@ -1,5 +1,5 @@
-import { staticAdapter } from '@builder.io/qwik-city/adapters/static/vite';
-import { extendConfig } from '@builder.io/qwik-city/vite';
+import { staticAdapter } from '@qwik.dev/router/adapters/static/vite';
+import { extendConfig } from '@qwik.dev/router/vite';
 import baseConfig from '../../vite.config';
 
 export default extendConfig(baseConfig, () => {

diff --git a/apps/website/recma-provide-components.ts b/apps/website/recma-provide-components.ts
@@ -98,7 +98,7 @@ export const recmaProvideComponents: Plugin<any, Program> = () => {
           local: { type: 'Identifier', name: '_inlinedQrl' },
         },
       ],
-      source: { type: 'Literal', value: '@builder.io/qwik' },
+      source: { type: 'Literal', value: '@qwik.dev/core' },
     });
   };
 };
diff --git a/apps/website/src/_state/MDXProvider.tsx b/apps/website/src/_state/MDXProvider.tsx
@@ -5,7 +5,7 @@ import {
   useContext,
   Slot,
   useContextProvider,
-} from '@builder.io/qwik';
+} from '@qwik.dev/core';
 
 export const MDXContext = createContextId<Components>('MDXContext');
 

diff --git a/apps/website/src/_state/app-state-context-id.ts b/apps/website/src/_state/app-state-context-id.ts
@@ -1,4 +1,4 @@
-import { createContextId } from '@builder.io/qwik';
+import { createContextId } from '@qwik.dev/core';
 import { AppState } from './app-state.type';
 
 export const APP_STATE_CONTEXT_ID = createContextId<AppState>('app-state-context-id');
diff --git a/apps/website/src/_state/use-app-state.ts b/apps/website/src/_state/use-app-state.ts
@@ -1,4 +1,4 @@
-import { useContext } from '@builder.io/qwik';
+import { useContext } from '@qwik.dev/core';
 import { APP_STATE_CONTEXT_ID } from './app-state-context-id';
 
 export const useAppState = () => {

diff --git a/apps/website/src/components/anatomy-table/anatomy-table.tsx b/apps/website/src/components/anatomy-table/anatomy-table.tsx
@@ -1,4 +1,4 @@
-import { component$ } from '@builder.io/qwik';
+import { component$ } from '@qwik.dev/core';
 
 type AnatomyTableProps = {
   firstColumnLabel?: string;

diff --git a/apps/website/src/components/animations/caveats.tsx b/apps/website/src/components/animations/caveats.tsx
@@ -1,4 +1,4 @@
-import { component$ } from '@builder.io/qwik';
+import { component$ } from '@qwik.dev/core';
 import { Note, NoteStatus } from '../note/note'; // Adjust the import path based on your structure
 
 export const TopLayerAnimationsCaveats = component$(() => {

diff --git a/apps/website/src/components/animations/compatability.tsx b/apps/website/src/components/animations/compatability.tsx
@@ -1,4 +1,4 @@
-import { component$ } from '@builder.io/qwik';
+import { component$ } from '@qwik.dev/core';
 import { Note, NoteStatus } from '../note/note'; // Adjust the import path based on your structure
 
 export const BrowserAnimationsCompatability = component$(() => {

diff --git a/apps/website/src/components/api-table/api-table.tsx b/apps/website/src/components/api-table/api-table.tsx
@@ -1,4 +1,4 @@
-import { component$ } from '@builder.io/qwik';
+import { component$ } from '@qwik.dev/core';
 import { InfoPopup } from '../info-popup/info-popup';
 export type APITableProps = {
   propDescriptors: {

diff --git a/apps/website/src/components/api-table/auto-api.tsx b/apps/website/src/components/api-table/auto-api.tsx
@@ -1,4 +1,4 @@
-import { JSXOutput, component$, $, QRL, useTask$, useSignal } from '@builder.io/qwik';
+import { JSXOutput, component$, $, QRL, useTask$, useSignal } from '@qwik.dev/core';
 import { APITable, type APITableProps } from './api-table';
 
 //This is a workaround for not being able to export across packages due to nx rule:

diff --git a/apps/website/src/components/code-copy/code-copy.tsx b/apps/website/src/components/code-copy/code-copy.tsx
@@ -1,4 +1,4 @@
-import { PropsOf, component$, useSignal } from '@builder.io/qwik';
+import { PropsOf, component$, useSignal } from '@qwik.dev/core';
 import { Button } from '~/components/ui';
 import { cn } from '@qwik-ui/utils';
 import copy from 'clipboard-copy';

diff --git a/apps/website/src/components/code-snippet/code-snippet.tsx b/apps/website/src/components/code-snippet/code-snippet.tsx
@@ -1,5 +1,5 @@
-import { PropsOf, component$, useSignal, useTask$ } from '@builder.io/qwik';
-import { useLocation } from '@builder.io/qwik-city';
+import { PropsOf, component$, useSignal, useTask$ } from '@qwik.dev/core';
+import { useLocation } from '@qwik.dev/router';
 import { Highlight } from '../highlight/highlight';
 
 // The below `/src/routes/docs/**/**/snippets/*.tsx` pattern is here so that import.meta.glob works both for styled and headless routes.

diff --git a/apps/website/src/components/component-status-badge/component-status-badge.tsx b/apps/website/src/components/component-status-badge/component-status-badge.tsx
@@ -1,4 +1,4 @@
-import { component$ } from '@builder.io/qwik';
+import { component$ } from '@qwik.dev/core';
 import { Badge } from '~/components/ui';
 import { ComponentStatus } from '~/_state/component-status.type';
 

diff --git a/apps/website/src/components/copy-css-config/copy-css-config.tsx b/apps/website/src/components/copy-css-config/copy-css-config.tsx
@@ -1,4 +1,4 @@
-import { component$, useSignal } from '@builder.io/qwik';
+import { component$, useSignal } from '@qwik.dev/core';
 import { Modal } from '@qwik-ui/headless';
 import { Button } from '~/components/ui';
 import { extractThemeCSS } from '@qwik-ui/utils';

diff --git a/apps/website/src/components/faq/faq.tsx b/apps/website/src/components/faq/faq.tsx
@@ -1,4 +1,4 @@
-import { component$ } from '@builder.io/qwik';
+import { component$ } from '@qwik.dev/core';
 import { Accordion } from '@qwik-ui/styled';
 
 export const FAQ = component$(() => {

diff --git a/apps/website/src/components/feature-list/feature-list.tsx b/apps/website/src/components/feature-list/feature-list.tsx
@@ -1,4 +1,4 @@
-import { component$ } from '@builder.io/qwik';
+import { component$ } from '@qwik.dev/core';
 import { Note } from '../note/note';
 import { LuBadge, LuBadgeAlert, LuBadgeCheck } from '@qwikest/icons/lucide';
 

diff --git a/apps/website/src/components/footer/footer.tsx b/apps/website/src/components/footer/footer.tsx
@@ -1,4 +1,4 @@
-import { component$ } from '@builder.io/qwik';
+import { component$ } from '@qwik.dev/core';
 import { GitHubIcon } from '../icons/GitHubIcon';
 import { DiscordIcon } from '../icons/discord';
 import { cn } from '@qwik-ui/utils';

diff --git a/apps/website/src/components/header/header.tsx b/apps/website/src/components/header/header.tsx
@@ -5,11 +5,11 @@ import {
   useComputed$,
   useSignal,
   useStyles$,
-} from '@builder.io/qwik';
+} from '@qwik.dev/core';
 // eslint-disable-next-line @nx/enforce-module-boundaries
 import { version as headlessVersion } from '../../../../../packages/kit-headless/package.json';
 // eslint-disable-next-line @nx/enforce-module-boundaries
-import { useLocation } from '@builder.io/qwik-city';
+import { useLocation } from '@qwik.dev/router';
 // eslint-disable-next-line @nx/enforce-module-boundaries
 // eslint-disable-next-line @nx/enforce-module-boundaries
 import { version as styledKitVersion } from '../../../../../packages/kit-styled/package.json';
@@ -239,12 +239,12 @@ const DarkModeToggle = component$<PropsOf<typeof Button>>(({ ...props }) => {
         (themeSig.value = await switchLightDark(themeSig.value || 'light'))
       }
     >
-      <div class="hidden dark:block">
+      <span class="hidden dark:block">
         <LuMoon class="h-6 w-6" />
-      </div>
-      <div class="block dark:hidden">
+      </span>
+      <span class="block dark:hidden">
         <LuSun class="h-6 w-6" />
-      </div>
+      </span>
     </Button>
   );
 });
diff --git a/apps/website/src/components/highlight/highlight.tsx b/apps/website/src/components/highlight/highlight.tsx
@@ -5,7 +5,7 @@ import {
   useSignal,
   useTask$,
   $,
-} from '@builder.io/qwik';
+} from '@qwik.dev/core';
 import { CodeCopy } from '../code-copy/code-copy';
 import { cn } from '@qwik-ui/utils';
 import { codeToHtml } from 'shiki';

diff --git a/apps/website/src/components/icons/AstroLogo.tsx b/apps/website/src/components/icons/AstroLogo.tsx
@@ -1,4 +1,4 @@
-import { component$, type PropsOf } from '@builder.io/qwik';
+import { component$, type PropsOf } from '@qwik.dev/core';
 
 export default component$((props: PropsOf<'svg'>) => {
   return (

diff --git a/apps/website/src/components/icons/QwikLogo.tsx b/apps/website/src/components/icons/QwikLogo.tsx
@@ -1,4 +1,4 @@
-import { component$, type PropsOf } from '@builder.io/qwik';
+import { component$, type PropsOf } from '@qwik.dev/core';
 
 export default component$((props: PropsOf<'svg'>) => {
   return (

diff --git a/apps/website/src/components/icons/logo.tsx b/apps/website/src/components/icons/logo.tsx
@@ -1,4 +1,4 @@
-import { PropsOf, component$ } from '@builder.io/qwik';
+import { PropsOf, component$ } from '@qwik.dev/core';
 import { cn } from '@qwik-ui/utils';
 import { useTheme } from '@qwik-ui/themes';
 

diff --git a/apps/website/src/components/info-popup/info-popup.tsx b/apps/website/src/components/info-popup/info-popup.tsx
@@ -1,4 +1,4 @@
-import { component$, useStyles$ } from '@builder.io/qwik';
+import { component$, useStyles$ } from '@qwik.dev/core';
 import { Popover } from '@qwik-ui/headless';
 
 type InfoProps = {
@@ -25,7 +25,7 @@ export const InfoPopup = component$((props: InfoProps) => {
   return (
     <Popover.Root flip={false} floating="top" gutter={4}>
       <Popover.Trigger class="flex items-center justify-center">
-        <div class="rounded-full p-1 hover:bg-slate-300 hover:bg-opacity-50">
+        <span class="rounded-full p-1 hover:bg-slate-300 hover:bg-opacity-50">
           <svg
             width="16"
             height="16"
@@ -42,7 +42,7 @@ export const InfoPopup = component$((props: InfoProps) => {
               clip-rule="evenodd"
             ></path>
           </svg>
-        </div>
+        </span>
       </Popover.Trigger>
 
       <Popover.Panel class="fade-info listbox rounded-base bg-transparent">

diff --git a/apps/website/src/components/install-snippet/install-snippet.tsx b/apps/website/src/components/install-snippet/install-snippet.tsx
@@ -1,4 +1,4 @@
-import { component$ } from '@builder.io/qwik';
+import { component$ } from '@qwik.dev/core';
 import { Tabs } from '@qwik-ui/headless';
 import { CodeCopy } from '../code-copy/code-copy';
 

diff --git a/apps/website/src/components/keyboard-interaction-table/keyboard-interaction-table.tsx b/apps/website/src/components/keyboard-interaction-table/keyboard-interaction-table.tsx
@@ -1,4 +1,4 @@
-import { component$ } from '@builder.io/qwik';
+import { component$ } from '@qwik.dev/core';
 
 type KBInteractionTableRowProps = {
   keyTitle: string;

diff --git a/apps/website/src/components/make-it-yours/make-it-yours.tsx b/apps/website/src/components/make-it-yours/make-it-yours.tsx
@@ -1,4 +1,4 @@
-import { $, PropsOf, component$, useComputed$ } from '@builder.io/qwik';
+import { $, PropsOf, component$, useComputed$ } from '@qwik.dev/core';
 import {
   ThemeBaseColors,
   ThemeBorderRadiuses,

diff --git a/apps/website/src/components/mdx-components/index.tsx b/apps/website/src/components/mdx-components/index.tsx
@@ -1,4 +1,4 @@
-import { type Component, type PropsOf, Slot, component$ } from '@builder.io/qwik';
+import { type Component, type PropsOf, Slot, component$ } from '@qwik.dev/core';
 import { cn } from '@qwik-ui/utils';
 import { AnatomyTable } from '../anatomy-table/anatomy-table';
 import { APITable } from '../api-table/api-table';