docs(Tooltip): add delay option examples

Three new delay options have been added for the Tooltip component: NoDelay, EarlyDelay, and LateDelay. These options have also been incorporated into the component's documentation for better understanding.

packages/react/src/docs/components/Tooltip.mdx

@@ -133,3 +133,54 @@ import { Tooltip, TooltipContent } from "@components/Tooltip";
         <LoadedCode from={`${GITHUB}/packages/react/src/docs/components/TooltipBlocks/Examples/Right.tsx`} />
     </TabContent>
 </TabProvider>
+
+### No Delay
+
+<TabProvider defaultName="preview">
+  <TabList>
+    <TabTrigger name={"preview"}>Preview</TabTrigger>
+    <TabTrigger name={"code"}>Code</TabTrigger>
+  </TabList>
+  <TabContent name="preview">
+    <Story layout="centered">
+      <Examples.NoDelay />
+    </Story>
+  </TabContent>
+  <TabContent name="code">
+    <LoadedCode from={`${GITHUB}/packages/react/src/docs/components/TooltipBlocks/Examples/NoDelay.tsx`} />
+  </TabContent>
+</TabProvider>
+
+### Early Delay
+
+<TabProvider defaultName="preview">
+  <TabList>
+    <TabTrigger name={"preview"}>Preview</TabTrigger>
+    <TabTrigger name={"code"}>Code</TabTrigger>
+  </TabList>
+  <TabContent name="preview">
+    <Story layout="centered">
+      <Examples.EarlyDelay />
+    </Story>
+  </TabContent>
+  <TabContent name="code">
+    <LoadedCode from={`${GITHUB}/packages/react/src/docs/components/TooltipBlocks/Examples/EarlyDelay.tsx`} />
+  </TabContent>
+</TabProvider>
+
+### Late Delay
+
+<TabProvider defaultName="preview">
+  <TabList>
+    <TabTrigger name={"preview"}>Preview</TabTrigger>
+    <TabTrigger name={"code"}>Code</TabTrigger>
+  </TabList>
+  <TabContent name="preview">
+    <Story layout="centered">
+      <Examples.LateDelay />
+    </Story>
+  </TabContent>
+  <TabContent name="code">
+    <LoadedCode from={`${GITHUB}/packages/react/src/docs/components/TooltipBlocks/Examples/LateDelay.tsx`} />
+  </TabContent>
+</TabProvider>

packages/react/src/docs/components/TooltipBlocks/Examples/EarlyDelay.tsx

@@ -0,0 +1,13 @@
+import { Button } from "@components/Button";
+import { Tooltip, TooltipContent } from "@components/Tooltip";
+
+export function EarlyDelay() {
+  return (
+    <Tooltip position="bottom">
+      <TooltipContent delay={"early"}>
+        <p>Tooltip!</p>
+      </TooltipContent>
+      <Button>Hover me</Button>
+    </Tooltip>
+  );
+}

packages/react/src/docs/components/TooltipBlocks/Examples/LateDelay.tsx

@@ -0,0 +1,13 @@
+import { Button } from "@components/Button";
+import { Tooltip, TooltipContent } from "@components/Tooltip";
+
+export function LateDelay() {
+  return (
+    <Tooltip position="bottom">
+      <TooltipContent delay={"late"}>
+        <p>Tooltip!</p>
+      </TooltipContent>
+      <Button>Hover me</Button>
+    </Tooltip>
+  );
+}

packages/react/src/docs/components/TooltipBlocks/Examples/NoDelay.tsx

@@ -0,0 +1,13 @@
+import { Button } from "@components/Button";
+import { Tooltip, TooltipContent } from "@components/Tooltip";
+
+export function NoDelay() {
+  return (
+    <Tooltip position="bottom">
+      <TooltipContent delay={"none"}>
+        <p>Tooltip!</p>
+      </TooltipContent>
+      <Button>Hover me</Button>
+    </Tooltip>
+  );
+}

packages/react/src/docs/components/TooltipBlocks/Examples/index.ts

@@ -2,6 +2,8 @@ import { Bottom } from "./Bottom";
 import { Left } from "./Left";
 import { Right } from "./Right";
 import { Top } from "./Top";
+import { NoDelay } from "./NoDelay";
+import { EarlyDelay } from "./EarlyDelay";
+import { LateDelay } from "./LateDelay";
 
-export default { Bottom, Left, Right, Top };
+export default { Bottom, Left, Right, Top, NoDelay, EarlyDelay, LateDelay };
-