🎨 Add new Flux icons: implement multiple reusable icon components (e.g., hand-raised, hand-thumb-up, heart, hashtag, home) with variant support for improved UI consistency.

resources/views/flux/tooltip/content.blade.php

@@ -0,0 +1,23 @@
+@blaze
+
+@props([
+    'kbd' => null,
+])
+
+@php
+$classes = Flux::classes([
+    'relative py-2 px-2.5',
+    'rounded-md',
+    'text-xs text-white font-medium',
+    'bg-zinc-800 dark:bg-zinc-700 dark:border dark:border-white/10',
+    'p-0 overflow-visible',
+]);
+@endphp
+
+<div popover="manual" {{ $attributes->class($classes) }} data-flux-tooltip-content>
+    {{ $slot }}
+
+    <?php if ($kbd): ?>
+        <span class="ps-1 text-zinc-300">{{ $kbd }}</span>
+    <?php endif; ?>
+</div>

resources/views/flux/tooltip/index.blade.php

@@ -0,0 +1,39 @@
+@blaze
+
+@props([
+    'interactive' => null,
+    'position' => 'top',
+    'align' => 'center',
+    'content' => null,
+    'kbd' => null,
+    'toggleable' => null,
+])
+
+@php
+// Support adding the .self modifier to the wire:model directive...
+if (($wireModel = $attributes->wire('model')) && $wireModel->directive && ! $wireModel->hasModifier('self')) {
+    unset($attributes[$wireModel->directive]);
+
+    $wireModel->directive .= '.self';
+
+    $attributes = $attributes->merge([$wireModel->directive => $wireModel->value]);
+}
+@endphp
+
+<?php if ($toggleable): ?>
+    <ui-dropdown position="{{ $position }} {{ $align }}" {{ $attributes }} data-flux-tooltip>
+        {{ $slot }}
+
+        <?php if ($content !== null): ?>
+            <flux:tooltip.content :$kbd>{{ $content }}</flux:tooltip.content>
+        <?php endif; ?>
+    </ui-dropdown>
+<?php else: ?>
+    <ui-tooltip position="{{ $position }} {{ $align }}" {{ $attributes }} data-flux-tooltip @if ($interactive) interactive @endif>
+        {{ $slot }}
+
+        <?php if ($content !== null): ?>
+            <flux:tooltip.content :$kbd>{{ $content }}</flux:tooltip.content>
+        <?php endif; ?>
+    </ui-tooltip>
+<?php endif; ?>