chore: bump deps

.changeset/config.json

@@ -7,5 +7,5 @@
   "access": "public",
   "baseBranch": "main",
   "updateInternalDependencies": "patch",
-  "ignore": ["@kobalte/docs", "@kobalte/playground"]
+  "ignore": ["@kobalte/docs"]
 }

.eslintrc.json

@@ -16,6 +16,7 @@
     "import/no-named-as-default-member": "off",
     "simple-import-sort/imports": "warn",
     "simple-import-sort/exports": "warn",
+    "@typescript-eslint/no-unused-vars": "warn",
     "@typescript-eslint/ban-ts-comment": "off",
     "@typescript-eslint/no-explicit-any": "off",
     "@typescript-eslint/ban-types": "off",

apps/docs/package.json

@@ -31,41 +31,41 @@
     "start": "solid-start start"
   },
   "dependencies": {
-    "@docsearch/css": "3.3.3",
-    "@docsearch/js": "3.3.3",
+    "@docsearch/css": "3.5.2",
+    "@docsearch/js": "3.5.2",
     "@kobalte/core": "0.10.0",
-    "@solidjs/meta": "0.28.4",
-    "@solidjs/router": "0.8.2",
+    "@solidjs/meta": "0.28.6",
+    "@solidjs/router": "0.8.3",
     "@tanstack/solid-virtual": "3.0.0-beta.6",
-    "clsx": "1.2.1",
-    "solid-js": "1.7.3",
-    "solid-start": "0.2.26",
-    "undici": "5.22.0"
+    "clsx": "2.0.0",
+    "solid-js": "1.7.11",
+    "solid-start": "0.3.4",
+    "undici": "5.23.0"
   },
   "devDependencies": {
     "@kobalte/tailwindcss": "0.7.0",
     "@mdx-js/mdx": "2.3.0",
     "@mdx-js/rollup": "2.3.0",
     "@tailwindcss/typography": "0.5.9",
-    "acorn": "8.8.2",
-    "autoprefixer": "10.4.14",
+    "acorn": "8.10.0",
+    "autoprefixer": "10.4.15",
     "github-slugger": "2.0.0",
-    "postcss": "8.4.21",
-    "rehype-pretty-code": "0.9.4",
+    "postcss": "8.4.28",
+    "rehype-pretty-code": "0.10.0",
     "rehype-raw": "6.1.1",
     "rehype-slug": "5.1.0",
     "remark-gfm": "3.0.1",
-    "remark-shiki-twoslash": "3.1.2",
-    "shiki": "0.14.1",
+    "remark-shiki-twoslash": "3.1.3",
+    "shiki": "0.14.3",
     "solid-mdx": "0.0.6",
-    "solid-start-netlify": "0.2.26",
-    "solid-start-node": "0.2.26",
-    "tailwindcss": "3.3.0",
+    "solid-start-netlify": "0.3.4",
+    "solid-start-node": "0.3.4",
+    "tailwindcss": "3.3.3",
     "typescript": "4.9.5",
-    "unist-util-visit": "^4.1.2",
+    "unist-util-visit": "5.0.0",
     "vite": "3.2.7"
   },
   "engines": {
-    "node": ">=16"
+    "node": ">=18"
   }
 }

apps/docs/src/components/callout.tsx

@@ -15,7 +15,7 @@ export function Callout(props: CalloutProps) {
         "not-prose flex items-center rounded-md mt-6 px-4 py-3 text-base",
         local.type === "note"
           ? "text-blue-800 bg-blue-50 dark:text-blue-400 dark:bg-blue-900/30"
-          : "text-amber-800 bg-amber-50 dark:text-amber-400 dark:bg-amber-900/20"
+          : "text-amber-800 bg-amber-50 dark:text-amber-400 dark:bg-amber-900/20",
       )}
       {...others}
     />

apps/docs/src/components/header.tsx

@@ -56,7 +56,7 @@ export function Header(props: HeaderProps) {
               "px-3 py-2 rounded-md flex items-center justify-center transition",
               !isChangelogPath()
                 ? "text-sky-700 hover:text-sky-800 dark:text-sky-300 dark:hover:text-sky-200 hover:bg-sky-100 dark:hover:bg-sky-800"
-                : "text-zinc-700 hover:text-zinc-800 dark:text-zinc-300 dark:hover:text-zinc-200 hover:bg-zinc-100 dark:hover:bg-zinc-800"
+                : "text-zinc-700 hover:text-zinc-800 dark:text-zinc-300 dark:hover:text-zinc-200 hover:bg-zinc-100 dark:hover:bg-zinc-800",
             )}
           >
             Components
@@ -67,7 +67,7 @@ export function Header(props: HeaderProps) {
               "px-3 py-2 rounded-md flex items-center justify-center transition",
               isChangelogPath()
                 ? "text-sky-700 hover:text-sky-800 dark:text-sky-300 dark:hover:text-sky-200 hover:bg-sky-100 dark:hover:bg-sky-800"
-                : "text-zinc-700 hover:text-zinc-800 dark:text-zinc-300 dark:hover:text-zinc-200 hover:bg-zinc-100 dark:hover:bg-zinc-800"
+                : "text-zinc-700 hover:text-zinc-800 dark:text-zinc-300 dark:hover:text-zinc-200 hover:bg-zinc-100 dark:hover:bg-zinc-800",
             )}
           >
             Changelog

apps/docs/src/components/kbd.tsx

@@ -8,7 +8,7 @@ export function Kbd(props: ComponentProps<"kbd">) {
     <kbd
       class={clsx(
         local.class,
-        "rounded-md border border-solid border-b-[3px] px-[0.4em] py-[0.1em] text-zinc-900 font-mono text-[0.8em] font-bold bg-zinc-100 border-zinc-300 dark:text-white/90 dark:bg-zinc-800 dark:border-zinc-600"
+        "rounded-md border border-solid border-b-[3px] px-[0.4em] py-[0.1em] text-zinc-900 font-mono text-[0.8em] font-bold bg-zinc-100 border-zinc-300 dark:text-white/90 dark:bg-zinc-800 dark:border-zinc-600",
       )}
       {...others}
     />

apps/docs/src/components/mobile-navigation.tsx

@@ -62,7 +62,7 @@ export function MobileNavigation(props: MobileNavigationProps) {
                   "block w-full font-sans transition font-normal rounded px-3 py-2 hover:bg-sky-50 dark:hover:bg-sky-900/20",
                   !isChangelogPath()
                     ? "text-sky-700 dark:text-sky-600"
-                    : "text-zinc-600 dark:text-zinc-400"
+                    : "text-zinc-600 dark:text-zinc-400",
                 )}
               >
                 Components
@@ -73,7 +73,7 @@ export function MobileNavigation(props: MobileNavigationProps) {
                   "block w-full font-sans transition font-normal rounded px-3 py-2 hover:bg-sky-50 dark:hover:bg-sky-900/20",
                   isChangelogPath()
                     ? "text-sky-700 dark:text-sky-600"
-                    : "text-zinc-600 dark:text-zinc-400"
+                    : "text-zinc-600 dark:text-zinc-400",
                 )}
               >
                 Changelog

apps/docs/src/components/navigation.tsx

@@ -32,7 +32,7 @@ export function Navigation(props: NavigationProps) {
                           "flex items-center justify-between w-full font-sans transition font-normal rounded px-3 py-2 hover:bg-sky-50 dark:hover:bg-sky-900/20",
                           link.href === location.pathname
                             ? "text-sky-700 dark:text-sky-600"
-                            : "text-zinc-600 dark:text-zinc-400"
+                            : "text-zinc-600 dark:text-zinc-400",
                         )}
                       >
                         <span>{link.title}</span>

apps/docs/src/components/preview.tsx

@@ -17,7 +17,7 @@ export function Preview(props: PreviewProps) {
         local.class,
         "kb-preview not-prose flex flex-col justify-center mt-4 overflow-y-auto p-4 border border-solid border-zinc-200 dark:bg-[#121212] dark:border-zinc-700",
         local.isCentered ? "items-center" : "items-start",
-        local.isRounded ? "rounded-lg" : "rounded-t-lg"
+        local.isRounded ? "rounded-lg" : "rounded-t-lg",
       )}
       {...others}
     />

apps/docs/src/components/prose.tsx

@@ -18,7 +18,7 @@ export function Prose(props: ComponentProps<"div">) {
         // link underline
         "prose-a:no-underline prose-a:shadow-[inset_0_-2px_0_0_var(--tw-prose-background,#fff),inset_0_calc(-1*(var(--tw-prose-underline-size,4px)+2px))_0_0_var(--tw-prose-underline,theme(colors.sky.300))] hover:prose-a:[--tw-prose-underline-size:6px] dark:[--tw-prose-background:theme(colors.zinc.900)] dark:prose-a:shadow-[inset_0_calc(-1*var(--tw-prose-underline-size,2px))_0_0_var(--tw-prose-underline,theme(colors.sky.800))] dark:hover:prose-a:[--tw-prose-underline-size:6px]",
         // hr
-        "dark:prose-hr:border-zinc-800"
+        "dark:prose-hr:border-zinc-800",
       )}
       {...others}
     />

apps/docs/src/components/table-of-contents.tsx

@@ -82,7 +82,7 @@ export function TableOfContents() {
     },
     {
       key: () => path.pathname,
-    }
+    },
   );
 
   const currentSection = useCurrentSection(toc);
@@ -109,7 +109,7 @@ export function TableOfContents() {
                         section.slug === currentSection()
                           ? "text-sky-700 dark:text-sky-600"
                           : "text-zinc-600 dark:text-zinc-400",
-                        section.depth === 3 && "pl-6"
+                        section.depth === 3 && "pl-6",
                       )}
                     >
                       {section.text}

apps/docs/src/components/tabs-snippets.tsx

@@ -16,7 +16,7 @@ export const TabsSnippets: ParentComponent<ComponentProps<typeof Tabs.Root>> &
     <Tabs.Root
       class={clsx(
         "kb-tabs-snippets not-prose my-6 overflow-y-auto rounded-lg border border-solid border-zinc-200 bg-[#fafafa] dark:bg-[#27272a] dark:border-[#3f3f46]",
-        local.class
+        local.class,
       )}
       {...others}
     />
@@ -44,7 +44,7 @@ TabsSnippets.Trigger = (props: ComponentProps<typeof Tabs.Trigger>) => {
     <Tabs.Trigger
       class={clsx(
         "outline-none text-sm px-3 py-2 text-zinc-700 ui-selected:font-medium focus-visible:bg-zinc-200 dark:text-white/80 dark:focus-visible:bg-zinc-700",
-        local.class
+        local.class,
       )}
       {...others}
     />

apps/docs/src/examples/alert-dialog.module.css

@@ -56,7 +56,9 @@
   border-radius: 6px;
   padding: 16px;
   background-color: white;
-  box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
+  box-shadow:
+    0 10px 15px -3px rgb(0 0 0 / 0.1),
+    0 4px 6px -4px rgb(0 0 0 / 0.1);
   animation: contentHide 300ms ease-in forwards;
 }
 

apps/docs/src/examples/checkbox.module.css

@@ -69,4 +69,3 @@
 [data-kb-theme="dark"] .checkbox__description {
   color: hsl(240 5% 65%);
 }
-

apps/docs/src/examples/combobox.module.css

@@ -9,7 +9,9 @@
   background-color: white;
   border: 1px solid hsl(240 6% 90%);
   color: hsl(240 4% 16%);
-  transition: border-color 250ms, color 250ms;
+  transition:
+    border-color 250ms,
+    color 250ms;
 }
 
 .combobox__control[data-invalid] {
@@ -82,7 +84,9 @@
   background-color: white;
   border-radius: 6px;
   border: 1px solid hsl(240 6% 90%);
-  box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
+  box-shadow:
+    0 4px 6px -1px rgb(0 0 0 / 0.1),
+    0 2px 4px -2px rgb(0 0 0 / 0.1);
   transform-origin: var(--kb-combobox-content-transform-origin);
   animation: contentHide 250ms ease-in forwards;
 }

apps/docs/src/examples/combobox.tsx

@@ -457,7 +457,7 @@ export function OptionGroupExample() {
       ALL_GROUP_OBJECT_OPTIONS.map(optionOrGroup => {
         // If it's a group, find matching options.
         const matchingOptions = optionOrGroup["options"]?.filter(option =>
-          filter.contains(option.label, value)
+          filter.contains(option.label, value),
         );
 
         // Return the group with only the matching options.
@@ -474,7 +474,7 @@ export function OptionGroupExample() {
         }
 
         return null;
-      }).filter(Boolean) as Array<Food | Category>
+      }).filter(Boolean) as Array<Food | Category>,
     );
   };
 

apps/docs/src/examples/context-menu.module.css

@@ -17,7 +17,9 @@
   background-color: white;
   border-radius: 6px;
   border: 1px solid hsl(240 6% 90%);
-  box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
+  box-shadow:
+    0 4px 6px -1px rgb(0 0 0 / 0.1),
+    0 2px 4px -2px rgb(0 0 0 / 0.1);
   outline: none;
   transform-origin: var(--kb-menu-content-transform-origin);
   animation: contentHide 250ms ease-in forwards;

apps/docs/src/examples/dialog.module.css

@@ -56,7 +56,9 @@
   border-radius: 6px;
   padding: 16px;
   background-color: white;
-  box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
+  box-shadow:
+    0 10px 15px -3px rgb(0 0 0 / 0.1),
+    0 4px 6px -4px rgb(0 0 0 / 0.1);
   animation: contentHide 300ms ease-in forwards;
 }
 

apps/docs/src/examples/dropdown-menu.module.css

@@ -47,7 +47,9 @@
   background-color: white;
   border-radius: 6px;
   border: 1px solid hsl(240 6% 90%);
-  box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
+  box-shadow:
+    0 4px 6px -1px rgb(0 0 0 / 0.1),
+    0 2px 4px -2px rgb(0 0 0 / 0.1);
   outline: none;
   transform-origin: var(--kb-menu-content-transform-origin);
   animation: contentHide 250ms ease-in forwards;

apps/docs/src/examples/hover-card.module.css

@@ -20,7 +20,9 @@
   border-radius: 6px;
   padding: 16px;
   background-color: white;
-  box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
+  box-shadow:
+    0 10px 15px -3px rgb(0 0 0 / 0.1),
+    0 4px 6px -4px rgb(0 0 0 / 0.1);
   transform-origin: var(--kb-hovercard-content-transform-origin);
   animation: contentHide 250ms ease-in forwards;
 }

apps/docs/src/examples/pagination.module.css

@@ -19,7 +19,10 @@
   color: hsl(240 4% 16%);
   font-size: 16px;
   line-height: 0;
-  transition: 250ms background-color, 250ms color, 250ms border-color;
+  transition:
+    250ms background-color,
+    250ms color,
+    250ms border-color;
   cursor: pointer;
   font-variant-numeric: tabular-nums;
   border: 1px solid hsl(240 6% 90%);

apps/docs/src/examples/popover.module.css

@@ -41,7 +41,9 @@
   border-radius: 6px;
   padding: 12px;
   background-color: white;
-  box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
+  box-shadow:
+    0 10px 15px -3px rgb(0 0 0 / 0.1),
+    0 4px 6px -4px rgb(0 0 0 / 0.1);
   transform-origin: var(--kb-popover-content-transform-origin);
   animation: contentHide 250ms ease-in forwards;
 }

apps/docs/src/examples/select.module.css

@@ -12,7 +12,9 @@
   background-color: white;
   border: 1px solid hsl(240 6% 90%);
   color: hsl(240 4% 16%);
-  transition: border-color 250ms, color 250ms;
+  transition:
+    border-color 250ms,
+    color 250ms;
 }
 
 .select__trigger:hover {
@@ -75,7 +77,9 @@
   background-color: white;
   border-radius: 6px;
   border: 1px solid hsl(240 6% 90%);
-  box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
+  box-shadow:
+    0 4px 6px -1px rgb(0 0 0 / 0.1),
+    0 2px 4px -2px rgb(0 0 0 / 0.1);
   transform-origin: var(--kb-select-content-transform-origin);
   animation: contentHide 250ms ease-in forwards;
 }

apps/docs/src/examples/switch.module.css

@@ -87,4 +87,3 @@
 [data-kb-theme="dark"] .switch__description {
   color: hsl(240 5% 65%);
 }
-

apps/docs/src/examples/text-field.module.css

@@ -21,7 +21,9 @@
   background-color: white;
   border: 1px solid hsl(240 6% 90%);
   color: hsl(240 4% 16%);
-  transition: border-color 250ms, color 250ms;
+  transition:
+    border-color 250ms,
+    color 250ms;
 }
 
 .text-field__input:hover {

apps/docs/src/examples/toast.module.css

@@ -42,7 +42,9 @@
   border-radius: 6px;
   padding: 12px;
   background-color: white;
-  box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
+  box-shadow:
+    0 10px 15px -3px rgb(0 0 0 / 0.1),
+    0 4px 6px -4px rgb(0 0 0 / 0.1);
 }
 
 .toast[data-opened] {

apps/docs/src/examples/toast.tsx

@@ -85,7 +85,7 @@ export function MultipleRegionsExample() {
       ),
       {
         region,
-      }
+      },
     );
   };
 

apps/docs/src/examples/tooltip.module.css

@@ -37,7 +37,9 @@
   background-color: hsl(240 4% 16%);
   color: white;
   font-size: 14px;
-  box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
+  box-shadow:
+    0 10px 15px -3px rgb(0 0 0 / 0.1),
+    0 4px 6px -4px rgb(0 0 0 / 0.1);
   transform-origin: var(--kb-tooltip-content-transform-origin);
   animation: contentHide 250ms ease-in forwards;
 }