Move to TanStack Start from Next.js (#184)

2026-07-13 09:12:38 +02:00 · 2024-10-07 16:44:17 +07:00
parent 3a89a1c07f
commit 950ebc3dad
514 changed files with 20021 additions and 15508 deletions
@@ -0,0 +1,43 @@
+import * as React from "react"
+import { cn } from "@/lib/utils"
+import { getShortcutKey } from "../utils"
+
+export interface ShortcutKeyProps
+  extends React.HTMLAttributes<HTMLSpanElement> {
+  keys: string[]
+}
+
+export const ShortcutKey = React.forwardRef<HTMLSpanElement, ShortcutKeyProps>(
+  ({ className, keys, ...props }, ref) => {
+    const modifiedKeys = keys.map((key) => getShortcutKey(key))
+    const ariaLabel = modifiedKeys
+      .map((shortcut) => shortcut.readable)
+      .join(" + ")
+
+    return (
+      <span
+        aria-label={ariaLabel}
+        className={cn("inline-flex items-center gap-0.5", className)}
+        {...props}
+        ref={ref}
+      >
+        {modifiedKeys.map((shortcut) => (
+          <kbd
+            key={shortcut.symbol}
+            className={cn(
+              "inline-block min-w-2.5 text-center align-baseline font-sans text-xs font-medium capitalize text-[rgb(156,157,160)]",
+
+              className,
+            )}
+            {...props}
+            ref={ref}
+          >
+            {shortcut.symbol}
+          </kbd>
+        ))}
+      </span>
+    )
+  },
+)
+
+ShortcutKey.displayName = "ShortcutKey"