Update prettier [skip ci] (#171)

* update prettier and run it

* minify api-docs.json

* Update prettier-plugin-tailwindcss

Author: brookslybrand

app/components/color-scheme-toggle.tsx

@@ -70,7 +70,7 @@ let ColorSchemeButton = React.forwardRef<
         "flex w-full items-center gap-4 px-4 py-1",
         colorScheme === props.value
           ? "text-red-brand"
-          : "hover:bg-gray-50 active:text-red-brand dark:hover:bg-gray-700 dark:active:text-red-brand"
+          : "hover:bg-gray-50 active:text-red-brand dark:hover:bg-gray-700 dark:active:text-red-brand",
       )}
     >
       <svg className="h-[18px] w-[18px]">

app/components/docs-header/data.server.ts

@@ -9,7 +9,7 @@ export type HeaderData = Awaited<ReturnType<typeof getHeaderData>>;
 export async function getHeaderData(
   lang: string,
   ref: string,
-  refParam?: string
+  refParam?: string,
 ) {
   let githubRef = ref;
   let branchesInMenu = ["main", "dev"];

app/components/docs-header/docs-header.tsx

@@ -87,7 +87,7 @@ function HeaderSvgLink({
       href={href}
       className={classNames(
         `hidden text-gray-400 hover:text-gray-900 dark:text-gray-400 dark:hover:text-gray-50 md:block`,
-        className
+        className,
       )}
       title={title}
     >

app/components/docs-menu/menu-desktop.tsx

@@ -6,7 +6,7 @@ export function NavMenuDesktop({ children }: { children: React.ReactNode }) {
       className={classNames(
         "sticky bottom-0 top-16 hidden w-[--nav-width] flex-col gap-3 self-start overflow-auto py-6 pl-8 pr-6 lg:flex",
         // Account for the height of the top nav
-        "h-[calc(100vh-var(--header-height))]"
+        "h-[calc(100vh-var(--header-height))]",
       )}
     >
       <div className="[&_*:focus]:scroll-mt-[6rem]">{children}</div>

app/components/docs-menu/menu.tsx

@@ -132,7 +132,7 @@ function MenuSummary({ children }: { children: React.ReactNode }) {
         sharedClassName,
         "_no-triangle block cursor-pointer select-none",
         "outline-none focus:outline-none focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-red-brand  dark:focus-visible:ring-gray-100",
-        "hover:bg-gray-50 active:bg-gray-100 dark:bg-gray-900 dark:hover:bg-gray-800 dark:active:bg-gray-700"
+        "hover:bg-gray-50 active:bg-gray-100 dark:bg-gray-900 dark:hover:bg-gray-800 dark:active:bg-gray-700",
       )}
     >
       <div className="flex h-5 w-full items-center justify-between font-bold">
@@ -157,7 +157,7 @@ function HeaderMenuLink({
           "relative -mx-4 flex items-center justify-between rounded-md px-4 py-3 font-bold",
           isActive
             ? "bg-gray-50 font-semibold text-red-brand dark:bg-gray-800"
-            : "hover:bg-gray-50 active:text-red-brand dark:hover:bg-gray-800 dark:active:text-red-brand"
+            : "hover:bg-gray-50 active:text-red-brand dark:hover:bg-gray-800 dark:active:text-red-brand",
         )
       }
     >
@@ -175,7 +175,7 @@ function MenuLink({ to, children }: { to: string; children: React.ReactNode }) {
           "relative -mx-2 flex items-center justify-between rounded-md px-4 py-1.5 lg:text-sm",
           isActive
             ? "bg-gray-50 font-semibold text-red-brand dark:bg-gray-800"
-            : "text-gray-400 hover:text-gray-800 active:text-red-brand dark:text-gray-400 dark:hover:text-gray-50 dark:active:text-red-brand"
+            : "text-gray-400 hover:text-gray-800 active:text-red-brand dark:text-gray-400 dark:hover:text-gray-50 dark:active:text-red-brand",
         )
       }
     >

app/components/on-this-page.tsx

@@ -69,7 +69,7 @@ export function LargeOnThisPage({
               className={classNames(
                 activeHeading == heading.slug &&
                   "text-gray-900 dark:text-gray-50",
-                " block py-1 text-sm text-gray-400 hover:text-gray-900 active:text-red-brand dark:text-gray-400 dark:hover:text-gray-50  dark:active:text-red-brand"
+                " block py-1 text-sm text-gray-400 hover:text-gray-900 active:text-red-brand dark:text-gray-400 dark:hover:text-gray-50  dark:active:text-red-brand",
               )}
             />
           </li>

app/components/package-select.tsx

@@ -52,7 +52,7 @@ function PackageLink({
     <span
       className={classNames(
         className,
-        "font-bold text-red-brand before:bg-red-brand"
+        "font-bold text-red-brand before:bg-red-brand",
       )}
     >
       {name}
@@ -63,7 +63,7 @@ function PackageLink({
       relative="path"
       className={classNames(
         className,
-        "hover:bg-gray-50 active:text-red-brand dark:text-gray-200 dark:hover:bg-gray-700 dark:active:text-red-brand"
+        "hover:bg-gray-50 active:text-red-brand dark:text-gray-200 dark:hover:bg-gray-700 dark:active:text-red-brand",
       )}
     >
       {name}

app/components/version-select.tsx

@@ -28,7 +28,7 @@ export function VersionSelect() {
         title={label}
         className={classNames(
           `_no-triangle relative flex h-[40px] w-24 cursor-pointer list-none items-center justify-between gap-3 overflow-hidden whitespace-nowrap rounded-full px-3`,
-          className
+          className,
         )}
       >
         <div>{label}</div>
@@ -100,7 +100,7 @@ function RefLink({ to, children }: { to: string; children: React.ReactNode }) {
           className,
           "after:absolute after:right-4 after:top-1 after:block after:-rotate-45 after:opacity-50 after:content-['→']",
           // Same as !isActive styles on <Link> below
-          "hover:bg-gray-50 active:text-red-brand dark:text-gray-200 dark:hover:bg-gray-700 dark:active:text-red-brand"
+          "hover:bg-gray-50 active:text-red-brand dark:text-gray-200 dark:hover:bg-gray-700 dark:active:text-red-brand",
         )}
       >
         {children}
@@ -114,7 +114,7 @@ function RefLink({ to, children }: { to: string; children: React.ReactNode }) {
         className,
         isActive
           ? "font-bold text-red-brand before:bg-red-brand"
-          : "before:bg-transparent hover:bg-gray-50 active:text-red-brand dark:text-gray-200 dark:hover:bg-gray-700 dark:active:text-red-brand"
+          : "before:bg-transparent hover:bg-gray-50 active:text-red-brand dark:text-gray-200 dark:hover:bg-gray-700 dark:active:text-red-brand",
       )}
       to={to}
     >

app/hooks/use-navigation.ts

@@ -13,7 +13,7 @@ export function useNavigation(to?: string, end?: boolean) {
 
   let navigation = Object.assign(
     { isActive: false, isPending: false },
-    navigation_
+    navigation_,
   );
 
   if (toPathname) {

app/modules/color-scheme/components.tsx

@@ -28,7 +28,7 @@ export function ColorSchemeScript() {
         if (media.matches) document.documentElement.classList.add("dark");
       }
     `,
-    [] // eslint-disable-line
+    [], // eslint-disable-line
     // we don't want this script to ever change
   );