feat(registry): add stat (#197)

* chore: cleanup

* feat: add stat

* chore: update key-value registry

* feat: add stat action thingy

* feat: update stat

* feat: add stat

* chore: update tsdocs

* feat(stat): rename primitives and complete component setup

- Rename StatChange -> StatTrend for better clarity
- Rename StatAccessory -> StatIndicator for semantic accuracy
- Update all data-slot attributes to match new names
- Add StatSeparator component for content division
- Create comprehensive type definitions
- Add stat to registry-ui and registry-examples
- Create documentation with API reference
- Add stat-variants-demo showcasing indicator variants
- Add stat-layout-demo showcasing layout options

* feat: add time-picker, key-value, and stat to registry.json

* feat: add time-picker and key-value demos to registry.json

* chore: update registry.json

* chore: cleanup docs

Author: sadmann7

docs/__registry__/index.tsx

@@ -277,7 +277,7 @@ export const Index: Record<string, any> = {
       name: "key-value",
       description: "",
       type: "registry:ui",
-      registryDependencies: ["button","input"],
+      registryDependencies: ["button","input","textarea"],
       files: [{
         path: "registry/default/ui/key-value.tsx",
         type: "registry:ui",
@@ -477,6 +477,20 @@ export const Index: Record<string, any> = {
       source: "",
       chunks: []
     },
+    "stat": {
+      name: "stat",
+      description: "",
+      type: "registry:ui",
+      registryDependencies: ["separator"],
+      files: [{
+        path: "registry/default/ui/stat.tsx",
+        type: "registry:ui",
+        target: ""
+      }],
+      component: React.lazy(() => import("@/registry/default/ui/stat.tsx")),
+      source: "",
+      chunks: []
+    },
     "stepper": {
       name: "stepper",
       description: "",
@@ -2409,6 +2423,48 @@ export const Index: Record<string, any> = {
       source: "",
       chunks: []
     },
+    "stat-demo": {
+      name: "stat-demo",
+      description: "",
+      type: "registry:example",
+      registryDependencies: ["stat","dropdown-menu"],
+      files: [{
+        path: "registry/default/examples/stat-demo.tsx",
+        type: "registry:example",
+        target: ""
+      }],
+      component: React.lazy(() => import("@/registry/default/examples/stat-demo.tsx")),
+      source: "",
+      chunks: []
+    },
+    "stat-variants-demo": {
+      name: "stat-variants-demo",
+      description: "",
+      type: "registry:example",
+      registryDependencies: ["stat"],
+      files: [{
+        path: "registry/default/examples/stat-variants-demo.tsx",
+        type: "registry:example",
+        target: ""
+      }],
+      component: React.lazy(() => import("@/registry/default/examples/stat-variants-demo.tsx")),
+      source: "",
+      chunks: []
+    },
+    "stat-layout-demo": {
+      name: "stat-layout-demo",
+      description: "",
+      type: "registry:example",
+      registryDependencies: ["stat"],
+      files: [{
+        path: "registry/default/examples/stat-layout-demo.tsx",
+        type: "registry:example",
+        target: ""
+      }],
+      component: React.lazy(() => import("@/registry/default/examples/stat-layout-demo.tsx")),
+      source: "",
+      chunks: []
+    },
     "stepper-demo": {
       name: "stepper-demo",
       description: "",

docs/app/(lobby)/pg/page.tsx

@@ -3,13 +3,17 @@
 import { Demo } from "@/components/demo";
 import { Shell } from "@/components/shell";
 import ColorPickerDemo from "@/registry/default/examples/color-picker-demo";
-import KeyValueDemo from "@/registry/default/examples/key-value-demo";
+import StatDemo from "@/registry/default/examples/stat-demo";
+import StatLayoutDemo from "@/registry/default/examples/stat-layout-demo";
+import StatVariantsDemo from "@/registry/default/examples/stat-variants-demo";
 
 export default function PlaygroundPage() {
   return (
     <Shell>
       <Demo>
-        <KeyValueDemo />
+        <StatDemo />
+        <StatVariantsDemo />
+        <StatLayoutDemo />
         <ColorPickerDemo />
       </Demo>
     </Shell>

docs/components/auto-type-table.tsx

@@ -1,5 +1,5 @@
 import { createGenerator } from "fumadocs-typescript";
-import { AutoTypeTable as FumadocsAutoTypeTable } from "fumadocs-typescript/ui";
+import { AutoTypeTable as AutoTypeTableImpl } from "fumadocs-typescript/ui";
 
 let cachedGenerator: ReturnType<typeof createGenerator> | null = null;
 
@@ -13,7 +13,7 @@ function getGenerator() {
 export function AutoTypeTable(props: Record<string, unknown>) {
   return (
     <div className="auto-type-table">
-      <FumadocsAutoTypeTable {...props} generator={getGenerator()} />
+      <AutoTypeTableImpl {...props} generator={getGenerator()} />
     </div>
   );
 }

docs/components/ui/button.tsx

@@ -9,14 +9,13 @@ const buttonVariants = cva(
   {
     variants: {
       variant: {
-        default:
-          "bg-primary text-primary-foreground shadow-xs hover:bg-primary/90",
+        default: "bg-primary text-primary-foreground hover:bg-primary/90",
         destructive:
-          "bg-destructive text-white shadow-xs hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:bg-destructive/60 dark:focus-visible:ring-destructive/40",
+          "bg-destructive text-white hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:bg-destructive/60 dark:focus-visible:ring-destructive/40",
         outline:
           "border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:border-input dark:bg-input/30 dark:hover:bg-input/50",
         secondary:
-          "bg-secondary text-secondary-foreground shadow-xs hover:bg-secondary/80",
+          "bg-secondary text-secondary-foreground hover:bg-secondary/80",
         ghost:
           "hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50",
         link: "text-primary underline-offset-4 hover:underline",
@@ -26,6 +25,8 @@ const buttonVariants = cva(
         sm: "h-8 gap-1.5 rounded-md px-3 has-[>svg]:px-2.5",
         lg: "h-10 rounded-md px-6 has-[>svg]:px-4",
         icon: "size-9",
+        "icon-sm": "size-8",
+        "icon-lg": "size-10",
       },
     },
     defaultVariants: {

docs/content/docs/components/avatar-group.mdx

@@ -24,7 +24,7 @@ npx shadcn@latest add "https://diceui.com/r/avatar-group"
      Install the following dependencies:
 
      ```package-install
-     @radix-ui/react-slot class-variance-authority
+     @radix-ui/react-slot
      ```
   </Step>
   <Step>

docs/content/docs/components/color-picker.mdx

@@ -24,7 +24,7 @@ npx shadcn@latest add "https://diceui.com/r/color-picker"
      Install the following dependencies:
 
      ```package-install
-     @radix-ui/react-popover @radix-ui/react-select @radix-ui/react-slider @radix-ui/react-slot class-variance-authority lucide-react
+     @radix-ui/react-popover @radix-ui/react-select @radix-ui/react-slider @radix-ui/react-slot lucide-react
      ```
   </Step>
   <Step>

docs/content/docs/components/color-swatch.mdx

@@ -24,7 +24,7 @@ npx shadcn@latest add "https://diceui.com/r/color-swatch"
      Install the following dependencies:
 
      ```package-install
-     @radix-ui/react-slot class-variance-authority
+     @radix-ui/react-slot
      ```
   </Step>
   <Step>

docs/content/docs/components/cropper.mdx

@@ -24,7 +24,7 @@ npx shadcn@latest add "https://diceui.com/r/cropper"
      Install the following dependencies:
 
      ```package-install
-     @radix-ui/react-slot class-variance-authority
+     @radix-ui/react-slot
      ```
   </Step>
   <Step>

docs/content/docs/components/key-value.mdx

@@ -1,6 +1,6 @@
 ---
-title: Key-Value
-description: A dynamic key-value input component for managing environment variables and configuration pairs with paste support and validation.
+title: Key Value
+description: A dynamic input component for managing key-value pairs with paste support and validation.
 preview: true
 links:
   api: /docs/components/key-value#api-reference

docs/content/docs/components/marquee.mdx

@@ -23,7 +23,7 @@ npx shadcn@latest add "https://diceui.com/r/marquee"
      Install the following dependencies:
 
      ```package-install
-     @radix-ui/react-slot class-variance-authority
+     @radix-ui/react-slot
      ```
   </Step>
   <Step>