[feat] integrate asset browser with widget system (#5629)

## Summary

Add asset browser dialog integration for combo widgets with full
animation support and proper state management.

(Thank you Claude from saving me me from merge conflict hell on this
one.)

## Changes

- Widget integration: combo widgets now use AssetBrowserModal for
eligible asset types
- Dialog animations: added animateHide() for smooth close transitions
- Async operations: proper sequencing of widget updates and dialog
animations
- Service layer: added getAssetsForNodeType() and getAssetDetails()
methods
- Type safety: comprehensive TypeScript types and error handling
- Test coverage: unit tests for all new functionality
- Bonus: fixed the hardcoded labels in AssetFilterBar

Widget behavior:
- Shows asset browser button for eligible widgets when asset API enabled
- Handles asset selection with proper callback sequencing
- Maintains widget value updates and litegraph notification

## Review Focus

I will call out some stuff inline.

## Screenshots


https://github.com/user-attachments/assets/9d3a72cf-d2b0-445f-8022-4c49daa04637

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5629-feat-integrate-asset-browser-with-widget-system-2726d73d365081a9a98be9a2307aee0b)
by [Unito](https://www.unito.io)

---------

Co-authored-by: Claude <noreply@anthropic.com>
Co-authored-by: GitHub Action <action@github.com>

src/platform/assets/composables/useAssetBrowser.ts

@@ -1,8 +1,9 @@
 import { computed, ref } from 'vue'
 
-import { t } from '@/i18n'
-import type { UUID } from '@/lib/litegraph/src/utils/uuid'
+import { d, t } from '@/i18n'
 import type { AssetItem } from '@/platform/assets/schemas/assetSchema'
+import { assetFilenameSchema } from '@/platform/assets/schemas/assetSchema'
+import { assetService } from '@/platform/assets/services/assetService'
 import {
   getAssetBaseModel,
   getAssetDescription
@@ -69,7 +70,7 @@ export function useAssetBrowser(assets: AssetItem[] = []) {
 
     // Create display stats from API data
     const stats = {
-      formattedDate: new Date(asset.created_at).toLocaleDateString(),
+      formattedDate: d(new Date(asset.created_at), { dateStyle: 'short' }),
       downloadCount: undefined, // Not available in API
       stars: undefined // Not available in API
     }
@@ -162,12 +163,41 @@ export function useAssetBrowser(assets: AssetItem[] = []) {
     return filtered.map(transformAssetForDisplay)
   })
 
-  // Actions
-  function selectAsset(asset: AssetDisplayItem): UUID {
+  /**
+   * Asset selection that fetches full details and executes callback with filename
+   * @param assetId - The asset ID to select and fetch details for
+   * @param onSelect - Optional callback to execute with the asset filename
+   */
+  async function selectAssetWithCallback(
+    assetId: string,
+    onSelect?: (filename: string) => void
+  ): Promise<void> {
     if (import.meta.env.DEV) {
-      console.log('Asset selected:', asset.id, asset.name)
+      console.debug('Asset selected:', assetId)
+    }
+
+    if (!onSelect) {
+      return
+    }
+
+    try {
+      const detailAsset = await assetService.getAssetDetails(assetId)
+      const filename = detailAsset.user_metadata?.filename
+      const validatedFilename = assetFilenameSchema.safeParse(filename)
+      if (!validatedFilename.success) {
+        console.error(
+          'Invalid asset filename:',
+          validatedFilename.error.errors,
+          'for asset:',
+          assetId
+        )
+        return
+      }
+
+      onSelect(validatedFilename.data)
+    } catch (error) {
+      console.error(`Failed to fetch asset details for ${assetId}:`, error)
     }
-    return asset.id
   }
 
   return {
@@ -182,7 +212,6 @@ export function useAssetBrowser(assets: AssetItem[] = []) {
     filteredAssets,
 
     // Actions
-    selectAsset,
-    transformAssetForDisplay
+    selectAssetWithCallback
   }
 }