create-qwik 1.1.5-dev20230624194124 → 1.1.5-dev20230625145153

package/starters/apps/basic/src/routes/demo/flower/index.tsx

@@ -1,6 +1,11 @@
-import { component$, useVisibleTask$, useStore, useStylesScoped$ } from '@builder.io/qwik';
-import { type DocumentHead, useLocation } from '@builder.io/qwik-city';
-import styles from './flower.css?inline';
+import {
+  component$,
+  useVisibleTask$,
+  useStore,
+  useStylesScoped$,
+} from "@builder.io/qwik";
+import { type DocumentHead, useLocation } from "@builder.io/qwik-city";
+import styles from "./flower.css?inline";
 
 export default component$(() => {
   useStylesScoped$(styles);
@@ -37,11 +42,11 @@ export default component$(() => {
       />
       <div
         style={{
-          '--state': `${state.count * 0.1}`,
+          "--state": `${state.count * 0.1}`,
         }}
         class={{
           host: true,
-          pride: loc.url.searchParams.get('pride') === 'true',
+          pride: loc.url.searchParams.get("pride") === "true",
         }}
       >
         {Array.from({ length: state.number }, (_, i) => (
@@ -51,7 +56,7 @@ export default component$(() => {
               square: true,
               odd: i % 2 === 0,
             }}
-            style={{ '--index': `${i + 1}` }}
+            style={{ "--index": `${i + 1}` }}
           />
         )).reverse()}
       </div>
@@ -60,5 +65,5 @@ export default component$(() => {
 });
 
 export const head: DocumentHead = {
-  title: 'Qwik Flower',
+  title: "Qwik Flower",
 };

package/starters/apps/basic/src/routes/demo/todolist/index.tsx

@@ -1,4 +1,4 @@
-import { component$ } from '@builder.io/qwik';
+import { component$ } from "@builder.io/qwik";
 import {
   type DocumentHead,
   routeLoader$,
@@ -6,8 +6,8 @@ import {
   zod$,
   z,
   Form,
-} from '@builder.io/qwik-city';
-import styles from './todolist.module.css';
+} from "@builder.io/qwik-city";
+import styles from "./todolist.module.css";
 
 interface ListItem {
   text: string;
@@ -59,18 +59,20 @@ export default component$(() => {
 
       <div class="container container-center">
         <Form action={action} spaReset>
-          <input type="text" name="text" required class={styles.input} />{' '}
+          <input type="text" name="text" required class={styles.input} />{" "}
           <button type="submit" class="button-dark">
             Add item
           </button>
         </Form>
 
-        <p class={styles.hint}>PS: This little app works even when JavaScript is disabled.</p>
+        <p class={styles.hint}>
+          PS: This little app works even when JavaScript is disabled.
+        </p>
       </div>
     </>
   );
 });
 
 export const head: DocumentHead = {
-  title: 'Qwik Todo List',
+  title: "Qwik Todo List",
 };

package/starters/apps/basic/src/routes/index.tsx

@@ -1,10 +1,10 @@
-import { component$ } from '@builder.io/qwik';
-import type { DocumentHead } from '@builder.io/qwik-city';
+import { component$ } from "@builder.io/qwik";
+import type { DocumentHead } from "@builder.io/qwik-city";
 
-import Counter from '~/components/starter/counter/counter';
-import Hero from '~/components/starter/hero/hero';
-import Infobox from '~/components/starter/infobox/infobox';
-import Starter from '~/components/starter/next-steps/next-steps';
+import Counter from "~/components/starter/counter/counter";
+import Hero from "~/components/starter/hero/hero";
+import Infobox from "~/components/starter/infobox/infobox";
+import Starter from "~/components/starter/next-steps/next-steps";
 
 export default component$(() => {
   return (
@@ -58,7 +58,7 @@ export default component$(() => {
               Example Apps
             </div>
             <p>
-              Have a look at the <a href="/demo/flower">Flower App</a> or the{' '}
+              Have a look at the <a href="/demo/flower">Flower App</a> or the{" "}
               <a href="/demo/todolist">Todo App</a>.
             </p>
           </Infobox>
@@ -102,11 +102,11 @@ export default component$(() => {
 });
 
 export const head: DocumentHead = {
-  title: 'Welcome to Qwik',
+  title: "Welcome to Qwik",
   meta: [
     {
-      name: 'description',
-      content: 'Qwik site description',
+      name: "description",
+      content: "Qwik site description",
     },
   ],
 };

package/starters/apps/basic/src/routes/layout.tsx

@@ -1,11 +1,11 @@
-import { component$, Slot, useStyles$ } from '@builder.io/qwik';
-import { routeLoader$ } from '@builder.io/qwik-city';
-import type { RequestHandler } from '@builder.io/qwik-city';
+import { component$, Slot, useStyles$ } from "@builder.io/qwik";
+import { routeLoader$ } from "@builder.io/qwik-city";
+import type { RequestHandler } from "@builder.io/qwik-city";
 
-import Header from '~/components/starter/header/header';
-import Footer from '~/components/starter/footer/footer';
+import Header from "~/components/starter/header/header";
+import Footer from "~/components/starter/footer/footer";
 
-import styles from './styles.css?inline';
+import styles from "./styles.css?inline";
 
 export const onGet: RequestHandler = async ({ cacheControl }) => {
   // Control caching for this request for best performance and to reduce hosting costs:

package/starters/apps/basic/src/routes/service-worker.ts

@@ -7,12 +7,12 @@
  * 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 "@builder.io/qwik-city/service-worker";
 
 setupServiceWorker();
 
-addEventListener('install', () => self.skipWaiting());
+addEventListener("install", () => self.skipWaiting());
 
-addEventListener('activate', () => self.clients.claim());
+addEventListener("activate", () => self.clients.claim());
 
 declare const self: ServiceWorkerGlobalScope;

package/starters/apps/basic/src/routes/styles.css

@@ -2,9 +2,9 @@
 
 /* SHELL ---------------------------------------- */
 html {
-  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
-    'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji',
-    'Segoe UI Symbol', 'Noto Color Emoji';
+  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont,
+    "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif,
+    "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
 }
 
 body {
@@ -182,7 +182,7 @@ button.button-small {
 .icon:before {
   width: 18px;
   height: 18px;
-  content: '';
+  content: "";
   display: inline-block;
   margin-right: 20px;
   position: relative;

package/starters/apps/empty/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 "@builder.io/qwik";
+import { useDocumentHead, useLocation } from "@builder.io/qwik-city";
 
 /**
  * The RouterHead component is placed inside of the document `<head>` element.

package/starters/apps/empty/src/root.tsx

@@ -1,8 +1,12 @@
-import { component$ } from '@builder.io/qwik';
-import { QwikCityProvider, RouterOutlet, ServiceWorkerRegister } from '@builder.io/qwik-city';
-import { RouterHead } from './components/router-head/router-head';
+import { component$ } from "@builder.io/qwik";
+import {
+  QwikCityProvider,
+  RouterOutlet,
+  ServiceWorkerRegister,
+} from "@builder.io/qwik-city";
+import { RouterHead } from "./components/router-head/router-head";
 
-import './global.css';
+import "./global.css";
 
 export default component$(() => {
   /**

package/starters/apps/empty/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 "@builder.io/qwik";
+import type { DocumentHead } from "@builder.io/qwik-city";
 
 export default component$(() => {
   return (
@@ -15,11 +15,11 @@ export default component$(() => {
 });
 
 export const head: DocumentHead = {
-  title: 'Welcome to Qwik',
+  title: "Welcome to Qwik",
   meta: [
     {
-      name: 'description',
-      content: 'Qwik site description',
+      name: "description",
+      content: "Qwik site description",
     },
   ],
 };

package/starters/apps/empty/src/routes/layout.tsx

@@ -1,5 +1,5 @@
-import { component$, Slot } from '@builder.io/qwik';
-import type { RequestHandler } from '@builder.io/qwik-city';
+import { component$, Slot } from "@builder.io/qwik";
+import type { RequestHandler } from "@builder.io/qwik-city";
 
 export const onGet: RequestHandler = async ({ cacheControl }) => {
   // Control caching for this request for best performance and to reduce hosting costs:

package/starters/apps/empty/src/routes/service-worker.ts

@@ -7,12 +7,12 @@
  * 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 "@builder.io/qwik-city/service-worker";
 
 setupServiceWorker();
 
-addEventListener('install', () => self.skipWaiting());
+addEventListener("install", () => self.skipWaiting());
 
-addEventListener('activate', () => self.clients.claim());
+addEventListener("activate", () => self.clients.claim());
 
 declare const self: ServiceWorkerGlobalScope;

package/starters/apps/library/.eslintrc.cjs

@@ -6,35 +6,35 @@ module.exports = {
     node: true,
   },
   extends: [
-    'eslint:recommended',
-    'plugin:@typescript-eslint/recommended',
-    'plugin:qwik/recommended',
+    "eslint:recommended",
+    "plugin:@typescript-eslint/recommended",
+    "plugin:qwik/recommended",
   ],
-  parser: '@typescript-eslint/parser',
+  parser: "@typescript-eslint/parser",
   parserOptions: {
     tsconfigRootDir: __dirname,
-    project: ['./tsconfig.json'],
+    project: ["./tsconfig.json"],
     ecmaVersion: 2021,
-    sourceType: 'module',
+    sourceType: "module",
     ecmaFeatures: {
       jsx: true,
     },
   },
-  plugins: ['@typescript-eslint'],
+  plugins: ["@typescript-eslint"],
   rules: {
-    '@typescript-eslint/no-explicit-any': 'off',
-    '@typescript-eslint/explicit-module-boundary-types': 'off',
-    '@typescript-eslint/no-inferrable-types': 'off',
-    '@typescript-eslint/no-non-null-assertion': 'off',
-    '@typescript-eslint/no-empty-interface': 'off',
-    '@typescript-eslint/no-namespace': 'off',
-    '@typescript-eslint/no-empty-function': 'off',
-    '@typescript-eslint/no-this-alias': 'off',
-    '@typescript-eslint/ban-types': 'off',
-    '@typescript-eslint/ban-ts-comment': 'off',
-    'prefer-spread': 'off',
-    'no-case-declarations': 'off',
-    'no-console': 'off',
-    '@typescript-eslint/no-unused-vars': ['error'],
+    "@typescript-eslint/no-explicit-any": "off",
+    "@typescript-eslint/explicit-module-boundary-types": "off",
+    "@typescript-eslint/no-inferrable-types": "off",
+    "@typescript-eslint/no-non-null-assertion": "off",
+    "@typescript-eslint/no-empty-interface": "off",
+    "@typescript-eslint/no-namespace": "off",
+    "@typescript-eslint/no-empty-function": "off",
+    "@typescript-eslint/no-this-alias": "off",
+    "@typescript-eslint/ban-types": "off",
+    "@typescript-eslint/ban-ts-comment": "off",
+    "prefer-spread": "off",
+    "no-case-declarations": "off",
+    "no-console": "off",
+    "@typescript-eslint/no-unused-vars": ["error"],
   },
 };

package/starters/apps/library/src/components/counter/counter.tsx

@@ -1,4 +1,4 @@
-import { component$, useSignal } from '@builder.io/qwik';
+import { component$, useSignal } from "@builder.io/qwik";
 
 export const Counter = component$(() => {
   const count = useSignal(0);

package/starters/apps/library/src/components/logo/logo.tsx

@@ -1,4 +1,4 @@
-import { component$ } from '@builder.io/qwik';
+import { component$ } from "@builder.io/qwik";
 
 export const Logo = component$(() => {
   return (

package/starters/apps/library/src/entry.dev.tsx

@@ -9,8 +9,8 @@
  * - More code is transferred to the browser than in SSR mode.
  * - Optimizer/Serialization/Deserialization code is not exercised!
  */
-import { render, type RenderOptions } from '@builder.io/qwik';
-import Root from './root';
+import { render, type RenderOptions } from "@builder.io/qwik";
+import Root from "./root";
 
 export default function (opts: RenderOptions) {
   return render(document, <Root />, opts);

package/starters/apps/library/src/entry.ssr.tsx

@@ -10,9 +10,12 @@
  * - npm run build
  *
  */
-import { renderToStream, type RenderToStreamOptions } from '@builder.io/qwik/server';
-import { manifest } from '@qwik-client-manifest';
-import Root from './root';
+import {
+  renderToStream,
+  type RenderToStreamOptions,
+} from "@builder.io/qwik/server";
+import { manifest } from "@qwik-client-manifest";
+import Root from "./root";
 
 export default function (opts: RenderToStreamOptions) {
   return renderToStream(<Root />, {

package/starters/apps/library/src/index.ts

@@ -1,2 +1,2 @@
-export { Logo } from './components/logo/logo';
-export { Counter } from './components/counter/counter';
+export { Logo } from "./components/logo/logo";
+export { Counter } from "./components/counter/counter";

package/starters/apps/library/src/root.tsx

@@ -1,5 +1,5 @@
-import { Counter } from './components/counter/counter';
-import { Logo } from './components/logo/logo';
+import { Counter } from "./components/counter/counter";
+import { Logo } from "./components/logo/logo";
 
 export default () => {
   return (

package/starters/apps/library/vite.config.ts

@@ -1,14 +1,14 @@
-import { defineConfig } from 'vite';
-import { qwikVite } from '@builder.io/qwik/optimizer';
+import { defineConfig } from "vite";
+import { qwikVite } from "@builder.io/qwik/optimizer";
 
 export default defineConfig(() => {
   return {
     build: {
-      target: 'es2020',
+      target: "es2020",
       lib: {
-        entry: './src/index.ts',
-        formats: ['es', 'cjs'],
-        fileName: (format) => `index.qwik.${format === 'es' ? 'mjs' : 'cjs'}`,
+        entry: "./src/index.ts",
+        formats: ["es", "cjs"],
+        fileName: (format) => `index.qwik.${format === "es" ? "mjs" : "cjs"}`,
       },
     },
     plugins: [qwikVite()],

package/starters/apps/site-with-visual-cms/src/components/builder-registry.ts

@@ -1,14 +1,14 @@
-import type { RegisteredComponent } from '@builder.io/sdk-qwik';
-import Counter from './counter/counter';
+import type { RegisteredComponent } from "@builder.io/sdk-qwik";
+import Counter from "./counter/counter";
 
 export const CUSTOM_COMPONENTS: RegisteredComponent[] = [
   {
     component: Counter,
-    name: 'Counter',
+    name: "Counter",
     inputs: [
       {
-        name: 'initialValue',
-        type: 'number',
+        name: "initialValue",
+        type: "number",
       },
     ],
   },

package/starters/apps/site-with-visual-cms/src/components/counter/counter.tsx

@@ -1,6 +1,6 @@
-import { component$, useSignal, $ } from '@builder.io/qwik';
-import styles from './counter.module.css';
-import Gauge from '../gauge';
+import { component$, useSignal, $ } from "@builder.io/qwik";
+import styles from "./counter.module.css";
+import Gauge from "../gauge";
 
 export default component$((props: { initialValue: number }) => {
   const count = useSignal(props.initialValue || 99);
@@ -35,7 +35,7 @@ export const celebrate = $(async () => {
     gravity: 0,
     decay: 0.95,
     startVelocity: 30,
-    colors: ['006ce9', 'ac7ff4', '18b6f6', '713fc2', 'ffffff'],
+    colors: ["006ce9", "ac7ff4", "18b6f6", "713fc2", "ffffff"],
     origin: {
       x: 0.5,
       y: 0.35,
@@ -47,9 +47,9 @@ export const celebrate = $(async () => {
       if ((globalThis as any).confetti) {
         return resolve((globalThis as any).confetti as any);
       }
-      const script = document.createElement('script');
+      const script = document.createElement("script");
       script.src =
-        'https://cdn.jsdelivr.net/npm/canvas-confetti@1.5.1/dist/confetti.browser.min.js';
+        "https://cdn.jsdelivr.net/npm/canvas-confetti@1.5.1/dist/confetti.browser.min.js";
       script.onload = () => resolve((globalThis as any).confetti as any);
       script.onerror = reject;
       document.head.appendChild(script);

package/starters/apps/site-with-visual-cms/src/components/footer/footer.tsx

@@ -1,5 +1,5 @@
-import { component$ } from '@builder.io/qwik';
-import styles from './footer.module.css';
+import { component$ } from "@builder.io/qwik";
+import styles from "./footer.module.css";
 
 export default component$(() => {
   return (

package/starters/apps/site-with-visual-cms/src/components/gauge/index.tsx

@@ -1,5 +1,5 @@
-import { component$ } from '@builder.io/qwik';
-import styles from './gauge.module.css';
+import { component$ } from "@builder.io/qwik";
+import styles from "./gauge.module.css";
 
 export default component$(({ value = 50 }: { value?: number }) => {
   const safeValue = value < 0 || value > 100 ? 50 : value;
@@ -13,7 +13,13 @@ export default component$(({ value = 50 }: { value?: number }) => {
             <stop offset="1000%" stop-color="#AC7FF4" />
           </linearGradient>
         </defs>
-        <circle r="56" cx="60" cy="60" stroke-width="8" style="fill: #000; stroke: #0000" />
+        <circle
+          r="56"
+          cx="60"
+          cy="60"
+          stroke-width="8"
+          style="fill: #000; stroke: #0000"
+        />
         <circle
           r="56"
           cx="60"

package/starters/apps/site-with-visual-cms/src/components/header/header.tsx

@@ -1,6 +1,6 @@
-import { component$ } from '@builder.io/qwik';
-import { QwikLogo } from '../icons/qwik';
-import styles from './header.module.css';
+import { component$ } from "@builder.io/qwik";
+import { QwikLogo } from "../icons/qwik";
+import styles from "./header.module.css";
 
 export default component$(() => {
   return (
@@ -13,17 +13,26 @@ export default component$(() => {
         </div>
         <ul>
           <li>
-            <a href="https://qwik.builder.io/docs/components/overview/" target="_blank">
+            <a
+              href="https://qwik.builder.io/docs/components/overview/"
+              target="_blank"
+            >
               Docs
             </a>
           </li>
           <li>
-            <a href="https://qwik.builder.io/examples/introduction/hello-world/" target="_blank">
+            <a
+              href="https://qwik.builder.io/examples/introduction/hello-world/"
+              target="_blank"
+            >
               Examples
             </a>
           </li>
           <li>
-            <a href="https://qwik.builder.io/tutorial/welcome/overview/" target="_blank">
+            <a
+              href="https://qwik.builder.io/tutorial/welcome/overview/"
+              target="_blank"
+            >
               Tutorials
             </a>
           </li>

package/starters/apps/site-with-visual-cms/src/components/icons/qwik.tsx

@@ -1,4 +1,10 @@
-export const QwikLogo = ({ width = 100, height = 35 }: { width?: number; height?: number }) => (
+export const QwikLogo = ({
+  width = 100,
+  height = 35,
+}: {
+  width?: number;
+  height?: number;
+}) => (
   <svg
     width={width}
     height={height}

package/starters/apps/site-with-visual-cms/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 "@builder.io/qwik";
+import { useDocumentHead, useLocation } from "@builder.io/qwik-city";
 
 /**
  * The RouterHead component is placed inside of the document `<head>` element.

package/starters/apps/site-with-visual-cms/src/entry.dev.tsx

@@ -9,8 +9,8 @@
  * - More code is transferred to the browser than in SSR mode.
  * - Optimizer/Serialization/Deserialization code is not exercised!
  */
-import { render, type RenderOptions } from '@builder.io/qwik';
-import Root from './root';
+import { render, type RenderOptions } from "@builder.io/qwik";
+import Root from "./root";
 
 export default function (opts: RenderOptions) {
   return render(document, <Root />, opts);

package/starters/apps/site-with-visual-cms/src/entry.preview.tsx

@@ -10,9 +10,9 @@
  * - https://vitejs.dev/config/preview-options.html#preview-options
  *
  */
-import { createQwikCity } from '@builder.io/qwik-city/middleware/node';
-import qwikCityPlan from '@qwik-city-plan';
-import render from './entry.ssr';
+import { createQwikCity } from "@builder.io/qwik-city/middleware/node";
+import qwikCityPlan from "@qwik-city-plan";
+import render from "./entry.ssr";
 
 /**
  * The default export is the QwikCity adapter used by Vite preview.

package/starters/apps/site-with-visual-cms/src/entry.ssr.tsx

@@ -10,9 +10,12 @@
  * - npm run build
  *
  */
-import { renderToStream, type RenderToStreamOptions } from '@builder.io/qwik/server';
-import { manifest } from '@qwik-client-manifest';
-import Root from './root';
+import {
+  renderToStream,
+  type RenderToStreamOptions,
+} from "@builder.io/qwik/server";
+import { manifest } from "@qwik-client-manifest";
+import Root from "./root";
 
 export default function (opts: RenderToStreamOptions) {
   return renderToStream(<Root />, {
@@ -20,7 +23,7 @@ export default function (opts: RenderToStreamOptions) {
     ...opts,
     // Use container attributes to set attributes on the html tag.
     containerAttributes: {
-      lang: 'en-us',
+      lang: "en-us",
       ...opts.containerAttributes,
     },
   });

package/starters/apps/site-with-visual-cms/src/global.css

@@ -21,9 +21,9 @@
 
 /* SHELL ---------------------------------------- */
 html {
-  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
-    'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji',
-    'Segoe UI Symbol', 'Noto Color Emoji';
+  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont,
+    "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif,
+    "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
   background: var(--footer-background);
 }
 

package/starters/apps/site-with-visual-cms/src/root.tsx

@@ -1,8 +1,12 @@
-import { component$ } from '@builder.io/qwik';
-import { QwikCityProvider, RouterOutlet, ServiceWorkerRegister } from '@builder.io/qwik-city';
-import { RouterHead } from './components/router-head/router-head';
+import { component$ } from "@builder.io/qwik";
+import {
+  QwikCityProvider,
+  RouterOutlet,
+  ServiceWorkerRegister,
+} from "@builder.io/qwik-city";
+import { RouterHead } from "./components/router-head/router-head";
 
-import './global.css';
+import "./global.css";
 
 export default component$(() => {
   /**