@uniweb/kit 0.1.10 → 0.2.0

package/src/search/hooks.js

@@ -236,4 +236,88 @@ export function useSearchIndex(website, options = {}) {
   }
 }
 
+/**
+ * Hook for Cmd/Ctrl+K keyboard shortcut to open search
+ *
+ * @param {Function|Object} callbacks - Either onOpen function, or { onOpen, onPreload }
+ *
+ * @example
+ * // Simple usage
+ * useSearchShortcut(() => setSearchOpen(true))
+ *
+ * // With preload
+ * useSearchShortcut({
+ *   onOpen: () => setSearchOpen(true),
+ *   onPreload: () => search.preload()
+ * })
+ */
+export function useSearchShortcut(callbacks) {
+  const { onOpen, onPreload } = typeof callbacks === 'function'
+    ? { onOpen: callbacks, onPreload: null }
+    : callbacks
+
+  useEffect(() => {
+    const handleKeyDown = (e) => {
+      if ((e.metaKey || e.ctrlKey) && e.key === 'k') {
+        e.preventDefault()
+        onPreload?.()
+        onOpen()
+      }
+    }
+
+    window.addEventListener('keydown', handleKeyDown)
+    return () => window.removeEventListener('keydown', handleKeyDown)
+  }, [onOpen, onPreload])
+}
+
+/**
+ * Hook that wraps useSearch with intent-based preloading
+ *
+ * Provides handlers to trigger preload on user intent (hover, focus, touch)
+ * rather than on component mount. This saves bandwidth for users who never search.
+ *
+ * @param {Object} website - Website instance from @uniweb/core
+ * @param {Object} options - Options passed to useSearch
+ * @returns {Object} Search state, methods, and intent handlers
+ *
+ * @example
+ * function SearchButton({ onClick }) {
+ *   const { intentProps, triggerPreload } = useSearchWithIntent(website)
+ *
+ *   useSearchShortcut({
+ *     onOpen: onClick,
+ *     onPreload: triggerPreload,
+ *   })
+ *
+ *   return (
+ *     <button onClick={onClick} {...intentProps}>
+ *       Search
+ *     </button>
+ *   )
+ * }
+ */
+export function useSearchWithIntent(website, options = {}) {
+  const search = useSearch(website, options)
+  const hasPreloaded = useRef(false)
+
+  const triggerPreload = useCallback(() => {
+    if (hasPreloaded.current) return
+    hasPreloaded.current = true
+    search.preload()
+  }, [search])
+
+  // Intent handlers - spread onto interactive elements
+  const intentProps = useMemo(() => ({
+    onMouseEnter: triggerPreload,
+    onFocus: triggerPreload,
+    onTouchStart: triggerPreload,
+  }), [triggerPreload])
+
+  return {
+    ...search,
+    triggerPreload,
+    intentProps,
+  }
+}
+
 export default useSearch

package/src/search/index.js

@@ -23,4 +23,4 @@
 
 export { createSearchClient, loadSearchIndex, clearSearchCache } from './client.js'
 export { buildSnippet, highlightMatches, escapeHtml } from './snippets.js'
-export { useSearch, useSearchIndex } from './hooks.js'
+export { useSearch, useSearchIndex, useSearchShortcut, useSearchWithIntent } from './hooks.js'

package/src/styled/Asset/Asset.jsx

@@ -8,8 +8,8 @@
 
 import React, { useState, useCallback, forwardRef, useImperativeHandle } from 'react'
 import { cn } from '../../utils/index.js'
-import { FileLogo } from '../FileLogo/index.js'
-import { Image } from '../Image/index.js'
+import { FileLogo } from '../../components/FileLogo/index.js'
+import { Image } from '../../components/Image/index.js'
 import { useWebsite } from '../../hooks/useWebsite.js'
 
 /**

package/src/utils/index.js

@@ -9,6 +9,75 @@ import { twMerge, twJoin } from 'tailwind-merge'
 // Re-export tailwind-merge utilities
 export { twMerge, twJoin }
 
+// ─────────────────────────────────────────────────────────────────
+// Locale Utilities
+// ─────────────────────────────────────────────────────────────────
+
+/**
+ * Common locale display names (native language names)
+ * Used as fallback when site.yml doesn't specify labels.
+ * Tree-shakeable: only included if foundation uses getLocaleLabel().
+ */
+export const LOCALE_DISPLAY_NAMES = {
+  en: 'English',
+  es: 'Español',
+  fr: 'Français',
+  de: 'Deutsch',
+  it: 'Italiano',
+  pt: 'Português',
+  nl: 'Nederlands',
+  pl: 'Polski',
+  ru: 'Русский',
+  ja: '日本語',
+  ko: '한국어',
+  zh: '中文',
+  'zh-CN': '简体中文',
+  'zh-TW': '繁體中文',
+  ar: 'العربية',
+  he: 'עברית',
+  hi: 'हिन्दी',
+  th: 'ไทย',
+  vi: 'Tiếng Việt',
+  tr: 'Türkçe',
+  uk: 'Українська',
+  cs: 'Čeština',
+  el: 'Ελληνικά',
+  hu: 'Magyar',
+  ro: 'Română',
+  sv: 'Svenska',
+  da: 'Dansk',
+  fi: 'Suomi',
+  no: 'Norsk',
+  id: 'Bahasa Indonesia',
+  ms: 'Bahasa Melayu'
+}
+
+/**
+ * Get display label for a locale
+ * Priority: locale.label (from site config) → LOCALE_DISPLAY_NAMES → code.toUpperCase()
+ *
+ * @param {Object|string} locale - Locale object {code, label?} or locale code string
+ * @returns {string} Display label for the locale
+ *
+ * @example
+ * getLocaleLabel({ code: 'es', label: 'Spanish' }) // 'Spanish'
+ * getLocaleLabel({ code: 'es' })                   // 'Español'
+ * getLocaleLabel('es')                             // 'Español'
+ * getLocaleLabel({ code: 'xx' })                   // 'XX'
+ */
+export function getLocaleLabel(locale) {
+  // Handle string input (just a code)
+  if (typeof locale === 'string') {
+    return LOCALE_DISPLAY_NAMES[locale] || locale.toUpperCase()
+  }
+
+  // Handle object input
+  if (!locale || !locale.code) return ''
+
+  // Priority: explicit label → known display name → uppercase code
+  return locale.label || LOCALE_DISPLAY_NAMES[locale.code] || locale.code.toUpperCase()
+}
+
 /**
  * Merge class names with Tailwind CSS conflict resolution
  * @param {...string} classes - Class names to merge