chore: update qwik deps to latest (#273)

Author: gioboa

CODING_STANDARDS.md

@@ -89,7 +89,7 @@ export const Tooltip = component$(({ tip, position = 'top', type, ...props}: Too
 ```
 
 - Use class and not className when in the JSX and in the component props (if you expect to have a class props part if the component props).
-- Try to avoid using `useBrowserVisibleTask$` function. See [Qwik best practices](https://qwik.builder.io/docs/cheat/best-practices/) for the why.
+- Try to avoid using `useVisibleTask$` function. See [Qwik best practices](https://qwik.builder.io/docs/cheat/best-practices/) for the why.
 - Try to use the Slot element whenever the component can accept children
 - Use array spread on props to allow the component user to send props that override ours. For example:
 

apps/website/src/components/header/header.tsx

@@ -44,7 +44,7 @@ export default component$(() => {
     setThemeClass();
   });
 
-  const isDocsRoute = location.pathname.indexOf('/docs/') !== -1;
+  const isDocsRoute = location.url.pathname.indexOf('/docs/') !== -1;
 
   return (
     <header class="fixed w-full z-10 border-b border-slate-600">

package.json

@@ -14,8 +14,8 @@
     "test:headless": "nx component-test headless --watch"
   },
   "devDependencies": {
-    "@builder.io/qwik": "0.23.0",
-    "@builder.io/qwik-city": "0.6.6",
+    "@builder.io/qwik": "0.100.0",
+    "@builder.io/qwik-city": "0.100.0",
     "@commitlint/cli": "^17.4.3",
     "@commitlint/config-angular": "^17.4.3",
     "@commitlint/config-conventional": "^17.4.3",

packages/headless/src/components/accordion/accordion.tsx

@@ -7,7 +7,7 @@ import {
   QRL,
   Signal,
   Slot,
-  useBrowserVisibleTask$,
+  useVisibleTask$,
   useContext,
   useContextProvider,
   useSignal,
@@ -48,7 +48,7 @@ export const Accordion = component$((props: AccordionProps) => {
 
   useContextProvider(accordionContext, contextService);
 
-  useBrowserVisibleTask$(() => {
+  useVisibleTask$(() => {
     contextService.setItemsBoxRef$(itemsBoxRef);
     const items = itemsBoxRef.value?.querySelectorAll<HTMLElement>('div.item');
     if (items?.length) {

packages/headless/src/components/menu/menu.tsx

@@ -6,7 +6,7 @@ import {
   QwikKeyboardEvent,
   Signal,
   Slot,
-  useBrowserVisibleTask$,
+  useVisibleTask$,
   useContext,
   useContextProvider,
   useId,
@@ -61,15 +61,15 @@ export const Menu = component$((props: MenuProps) => {
 
   useContextProvider(quiMenuContext, menuContextService);
 
-  useBrowserVisibleTask$(({ track }) => {
+  useVisibleTask$(({ track }) => {
     track(() => isExpanded.value);
     if (!isExpanded.value) {
       currentButtonInFocusIndex.value = -1;
       currentId.value = '';
     }
   });
 
-  useBrowserVisibleTask$(() => {
+  useVisibleTask$(() => {
     const options = container.value?.querySelectorAll<HTMLElement>('button');
     if (options?.length) {
       options.forEach((option) => children.push(option));

packages/headless/src/components/popover/popover-content.tsx

@@ -1,7 +1,7 @@
 import {
   component$,
   Slot,
-  useBrowserVisibleTask$,
+  useVisibleTask$,
   useContext,
   useSignal,
   useStylesScoped$,
@@ -14,7 +14,7 @@ export const PopoverContent = component$(() => {
   const contextService = useContext(PopoverContext);
   useStylesScoped$(styles);
 
-  useBrowserVisibleTask$(() => {
+  useVisibleTask$(() => {
     contextService.setOverlayRef$(ref);
   });
 

packages/headless/src/components/popover/popover-trigger.tsx

@@ -2,7 +2,7 @@ import {
   $,
   component$,
   Slot,
-  useBrowserVisibleTask$,
+  useVisibleTask$,
   useContext,
   useSignal,
   useStylesScoped$,
@@ -15,7 +15,7 @@ export const PopoverTrigger = component$(() => {
   const contextService = useContext(PopoverContext);
   useStylesScoped$(styles);
 
-  useBrowserVisibleTask$(() => {
+  useVisibleTask$(() => {
     contextService.setTriggerRef$(ref);
   });
 

packages/headless/src/components/popover/popover.tsx

@@ -5,7 +5,7 @@ import {
   QwikMouseEvent,
   Signal,
   Slot,
-  useBrowserVisibleTask$,
+  useVisibleTask$,
   useContextProvider,
   useSignal,
   useStore,
@@ -154,7 +154,7 @@ export const Popover = component$((props: PopoverProps) => {
    * Sync isOpen external property with internal context
    * NOTE: useful when the popover status is controlled from the outside
    */
-  useBrowserVisibleTask$(({ track }) => {
+  useVisibleTask$(({ track }) => {
     track(() => props.isOpen);
     contextService.isOpen = !!props.isOpen;
   });
@@ -163,7 +163,7 @@ export const Popover = component$((props: PopoverProps) => {
    * Watch isOpen context property
    * and apply CSS classes to show and hide the Popover Content
    */
-  useBrowserVisibleTask$(({ track }) => {
+  useVisibleTask$(({ track }) => {
     track(() => contextService.isOpen);
     if (!triggerRef.value || !contentRef.value) return;
 

packages/headless/src/components/slider/slider.tsx

@@ -4,7 +4,7 @@ import {
   PropFunction,
   Signal,
   Slot,
-  useBrowserVisibleTask$,
+  useVisibleTask$,
   useContextProvider,
   useSignal,
 } from '@builder.io/qwik';
@@ -56,13 +56,13 @@ export const Slider = component$(
       percentage: percentageSignal,
     };
 
-    useBrowserVisibleTask$(async ({ track }) => {
+    useVisibleTask$(async ({ track }) => {
       track(() => rootPositionRef);
       contextService.positionX.value =
         rootPositionRef.value?.getBoundingClientRect().x;
     });
 
-    useBrowserVisibleTask$(async ({ track }) => {
+    useVisibleTask$(async ({ track }) => {
       const newValue = track(() => sliderValue.value);
       if (onChange$) {
         onChange$(newValue);

packages/headless/src/components/tabs/tabs.tsx

@@ -8,8 +8,9 @@ import {
   Slot,
   useContext,
   useContextProvider,
-  useMount$,
+  useTask$,
   useSignal,
+  useVisibleTask$,
 } from '@builder.io/qwik';
 
 export type Behavior = 'automatic' | 'manual';
@@ -90,7 +91,7 @@ export const Tab = component$(
     const contextService = useContext(tabsContext);
     const thisTabIndex = useSignal(0);
 
-    useMount$(async () => {
+    useTask$(async () => {
       thisTabIndex.value = await contextService.getNextTabIndex();
     });
     const isSelected = () =>
@@ -138,7 +139,7 @@ export const TabPanel = component$(({ ...props }: TabPanelProps) => {
   const thisPanelIndex = useSignal(0);
   const isSelected = () =>
     thisPanelIndex.value === contextService.selectedIndex.value;
-  useMount$(async () => {
+  useVisibleTask$(async () => {
     thisPanelIndex.value = await contextService.getNextPanelIndex();
   });
   return (