@alia.onl/sdk 4.0.1 → 4.1.0

package/CHANGELOG.md

@@ -0,0 +1,48 @@
+# @alia.onl/sdk
+
+## 4.1.0
+
+### Changed
+
+- Every `lucide-react-native` import is now a per-icon subpath
+  (`lucide-react-native/icons/<name>`) instead of the package barrel, and the
+  dependency moved from `^0.562.0` to `^1.24.0` (the first line that exposes
+  `./icons/*` in its `exports` map, with per-icon type declarations).
+
+  The barrel statically re-exports ~1750 icon modules and Metro does not
+  tree-shake, so a single named import pulled roughly 1.2 MB of unused icon
+  source into every consumer bundle. Measured with a real Metro build of the
+  same eight icons: 1755 modules / 1 656 869 bytes via the barrel versus
+  16 modules / 18 312 bytes via subpaths.
+
+- **Consumers must enable Metro's package-exports resolution.** Set
+  `resolver.unstable_enablePackageExports = true` in `metro.config.js`. It is
+  the default in Expo SDK 53+ and Metro 0.82+, so most projects already have
+  it. Without it the bundle fails at build time with
+  `Unable to resolve module lucide-react-native/icons/…` — a loud failure, not
+  a silent runtime one.
+
+The public API is unchanged: no icon is re-exported from `.` or `./voice`, and
+no exported component, hook, or type was added, removed, or renamed.
+
+## 4.0.1
+
+- Expose `./package.json` in the `exports` map.
+
+## 4.0.0
+
+### Breaking
+
+- The voice surface moved from the root entry to `@alia.onl/sdk/voice` so
+  text-chat consumers no longer pull `livekit-client` through the export
+  barrel. Update imports of `AudioWaveVisualizer`, `VoiceOverlay`,
+  `VoiceControls`, `useVoiceRoom`, `useAudioLevelMonitor`, `useAudioLevels`,
+  `useAmbientWave`, `useSoundEffects`, `useVoiceSoundEffects`, and the
+  `RoomState` / `AgentState` / `VoiceMessage` / `VoiceToolInvocation` types.
+
+  Note that rendering `AliaChatScreen` or `AliaChatSheet` still reaches
+  `livekit-client`: `AliaChatContent` imports `useVoiceRoom` and
+  `useAudioLevelMonitor` directly. Only consumers composing the leaf
+  primitives themselves avoid it.
+- An `exports` map was introduced, so deep imports into package internals no
+  longer resolve. Only `.`, `./voice`, and `./package.json` are public.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@alia.onl/sdk",
-  "version": "4.0.1",
+  "version": "4.1.0",
   "description": "Alia AI chat SDK — reusable chat UI, voice, and streaming components for Oxy apps",
   "main": "src/index.ts",
   "react-native": "src/index.ts",
@@ -13,7 +13,8 @@
   },
   "files": [
     "src",
-    "tsconfig.json"
+    "tsconfig.json",
+    "CHANGELOG.md"
   ],
   "private": false,
   "publishConfig": {
@@ -27,7 +28,7 @@
     "@tanstack/react-query-persist-client": "^5.101.2",
     "class-variance-authority": "^0.7.1",
     "clsx": "^2.1.1",
-    "lucide-react-native": "^0.562.0",
+    "lucide-react-native": "^1.24.0",
     "react-native-markdown-display": "^7.0.2",
     "tailwind-merge": "^3.6.0",
     "zeego": "^3.0.6",
@@ -36,7 +37,7 @@
   "peerDependencies": {
     "react": "^19.2.3",
     "react-native": "^0.86.0",
-    "@oxyhq/services": "^20.0.0",
+    "@oxyhq/services": "^22.12.3",
     "@react-native-async-storage/async-storage": "^2.2.0",
     "socket.io-client": "^4.8.3",
     "expo-font": "^57.0.0",

package/src/components/AliaChatContent.tsx

@@ -16,7 +16,7 @@ import React, {
 import { View, StyleSheet } from 'react-native';
 import { useSharedValue } from 'react-native-reanimated';
 import type { SharedValue } from 'react-native-reanimated';
-import { Volume2 } from 'lucide-react-native';
+import Volume2 from 'lucide-react-native/icons/volume-2';
 import { useAliaChat, type UseAliaChatOptions } from '../hooks/useAliaChat';
 import { useVoiceRoom } from '../hooks/useVoiceRoom';
 import { useAudioLevelMonitor } from '../hooks/useAudioLevelMonitor';

package/src/components/AliaChatMessageList.tsx

@@ -11,15 +11,13 @@ import Animated, {
   cancelAnimation,
   type SharedValue,
 } from 'react-native-reanimated';
-import {
-  Copy,
-  Check,
-  Volume2,
-  Square,
-  ThumbsUp,
-  ThumbsDown,
-  Pencil,
-} from 'lucide-react-native';
+import Copy from 'lucide-react-native/icons/copy';
+import Check from 'lucide-react-native/icons/check';
+import Volume2 from 'lucide-react-native/icons/volume-2';
+import Square from 'lucide-react-native/icons/square';
+import ThumbsUp from 'lucide-react-native/icons/thumbs-up';
+import ThumbsDown from 'lucide-react-native/icons/thumbs-down';
+import Pencil from 'lucide-react-native/icons/pencil';
 import { Text } from './ui/text';
 import { AliaMarkdown } from './Markdown';
 import { ThinkingIndicator } from './ThinkingIndicator';

package/src/components/PlanPreviewCard.tsx

@@ -1,7 +1,9 @@
 import { View, Pressable } from 'react-native';
 import { Text } from './ui/text';
 import { Button } from './ui/button';
-import { Check, X, ListChecks } from 'lucide-react-native';
+import Check from 'lucide-react-native/icons/check';
+import X from 'lucide-react-native/icons/x';
+import ListChecks from 'lucide-react-native/icons/list-checks';
 import Animated from 'react-native-reanimated';
 import { planPreviewEnter } from '../animations';
 import type { PlanStep } from '../types';

package/src/components/ResearchProgressCard.tsx

@@ -2,15 +2,13 @@ import { useState } from 'react';
 import { View, Pressable } from 'react-native';
 import { Text } from './ui/text';
 import { cn } from '../lib/utils';
-import {
-  Search,
-  BookOpen,
-  CheckCircle,
-  ChevronDown,
-  ChevronUp,
-  ExternalLink,
-  Loader2,
-} from 'lucide-react-native';
+import Search from 'lucide-react-native/icons/search';
+import BookOpen from 'lucide-react-native/icons/book-open';
+import CircleCheckBig from 'lucide-react-native/icons/circle-check-big';
+import ChevronDown from 'lucide-react-native/icons/chevron-down';
+import ChevronUp from 'lucide-react-native/icons/chevron-up';
+import ExternalLink from 'lucide-react-native/icons/external-link';
+import LoaderCircle from 'lucide-react-native/icons/loader-circle';
 import type { ResearchProgress } from '../types';
 
 interface ResearchProgressCardProps {
@@ -42,7 +40,7 @@ export function ResearchProgressCard({ progress }: ResearchProgressCardProps) {
       <View className="flex-row items-center gap-2">
         <View className="w-8 h-8 rounded-full bg-primary/10 items-center justify-center">
           {isComplete ? (
-            <CheckCircle size={16} className="text-green-500" />
+            <CircleCheckBig size={16} className="text-green-500" />
           ) : (
             <Search size={16} className="text-primary" />
           )}
@@ -111,7 +109,7 @@ export function ResearchProgressCard({ progress }: ResearchProgressCardProps) {
       {/* Current search query indicator */}
       {progress.currentQuery && !isComplete && (
         <View className="flex-row items-center gap-2 bg-muted/50 rounded-lg px-3 py-1.5">
-          <Loader2 size={12} className="text-muted-foreground" />
+          <LoaderCircle size={12} className="text-muted-foreground" />
           <Text className="text-xs text-muted-foreground flex-1" numberOfLines={1}>
             {progress.currentQuery}
           </Text>

package/src/components/ThinkingIndicator.tsx

@@ -30,7 +30,7 @@ const workingPhrases = [
   "Doing the thing...",
 ];
 
-export function ThinkingIndicator({ isWorking = false, statusText }: { isWorking?: boolean; statusText?: string }) {
+export function ThinkingIndicator({ isWorking = false, statusText, color }: { isWorking?: boolean; statusText?: string; color?: string }) {
   const phrases = isWorking ? workingPhrases : thinkingPhrases;
   const [phraseIndex, setPhraseIndex] = useState(() =>
     Math.floor(Math.random() * phrases.length)
@@ -84,7 +84,7 @@ export function ThinkingIndicator({ isWorking = false, statusText }: { isWorking
 
   return (
     <View className="flex-row items-center gap-2 py-2">
-      <AliaMark size={16} state={isWorking ? 'working' : 'thinking'} className="text-muted-foreground" />
+      <AliaMark size={16} state={isWorking ? 'working' : 'thinking'} color={color} />
       <View className="flex-row items-center">
         <Text className="text-base text-muted-foreground">{shownText}</Text>
         {(statusText || isTyping) && (

package/src/components/ui/dropdown-menu.web.tsx

@@ -5,27 +5,54 @@ import * as DropdownMenuPrimitive from "@radix-ui/react-dropdown-menu";
 import { CheckIcon, ChevronRightIcon } from "@radix-ui/react-icons";
 import * as React from "react";
 import type { LucideIcon } from "lucide-react-native";
-import {
-  Star, Pencil, Trash2, Share2, Download, Settings, HelpCircle,
-  Image, FileText, Search, ShoppingBag, MoreHorizontal, ExternalLink,
-  BookOpen, Globe, PenTool, Sparkles, User, CreditCard, Bell, LogOut,
-  Folder, Check, Brain, Ghost, Bot, Bookmark, AlertTriangle, Pin,
-} from "lucide-react-native";
+// Per-icon subpaths, never the `lucide-react-native` barrel: the barrel
+// statically re-exports all ~1500 icons, and Metro has no tree shaking, so a
+// single named import pulls ~1.3 MB of unused icon modules into every consumer
+// bundle.
+import Star from "lucide-react-native/icons/star";
+import Pencil from "lucide-react-native/icons/pencil";
+import Trash2 from "lucide-react-native/icons/trash-2";
+import Share2 from "lucide-react-native/icons/share-2";
+import Download from "lucide-react-native/icons/download";
+import Settings from "lucide-react-native/icons/settings";
+import CircleQuestionMark from "lucide-react-native/icons/circle-question-mark";
+import Image from "lucide-react-native/icons/image";
+import FileText from "lucide-react-native/icons/file-text";
+import Search from "lucide-react-native/icons/search";
+import ShoppingBag from "lucide-react-native/icons/shopping-bag";
+import Ellipsis from "lucide-react-native/icons/ellipsis";
+import ExternalLink from "lucide-react-native/icons/external-link";
+import BookOpen from "lucide-react-native/icons/book-open";
+import Globe from "lucide-react-native/icons/globe";
+import PenTool from "lucide-react-native/icons/pen-tool";
+import Sparkles from "lucide-react-native/icons/sparkles";
+import User from "lucide-react-native/icons/user";
+import CreditCard from "lucide-react-native/icons/credit-card";
+import Bell from "lucide-react-native/icons/bell";
+import LogOut from "lucide-react-native/icons/log-out";
+import Folder from "lucide-react-native/icons/folder";
+import Check from "lucide-react-native/icons/check";
+import Brain from "lucide-react-native/icons/brain";
+import Ghost from "lucide-react-native/icons/ghost";
+import Bot from "lucide-react-native/icons/bot";
+import Bookmark from "lucide-react-native/icons/bookmark";
+import TriangleAlert from "lucide-react-native/icons/triangle-alert";
+import Pin from "lucide-react-native/icons/pin";
 
 // Map iOS SF Symbol names to Lucide icons for web rendering
 const SF_SYMBOL_MAP: Record<string, LucideIcon> = {
   "star": Star, "star.fill": Star, "pencil": Pencil, "trash": Trash2,
   "square.and.arrow.up": Share2, "arrow.down.doc": Download,
-  "gearshape": Settings, "questionmark.circle": HelpCircle,
+  "gearshape": Settings, "questionmark.circle": CircleQuestionMark,
   "photo": Image, "doc": FileText, "magnifyingglass": Search,
-  "bag": ShoppingBag, "ellipsis": MoreHorizontal, "link": ExternalLink,
+  "bag": ShoppingBag, "ellipsis": Ellipsis, "link": ExternalLink,
   "book": BookOpen, "globe": Globe, "pencil.tip": PenTool,
   "sparkle": Sparkles, "person.circle": User, "creditcard": CreditCard,
   "bell": Bell, "rectangle.portrait.and.arrow.right": LogOut,
   "folder": Folder, "checkmark": Check, "brain": Brain,
   "eye.slash": Ghost, "cpu": Bot,
   "bookmark": Bookmark, "bookmark.fill": Bookmark,
-  "exclamationmark.triangle": AlertTriangle,
+  "exclamationmark.triangle": TriangleAlert,
   "pin": Pin, "pin.fill": Pin,
 };
 

package/src/components/ui/prompt-input/add-menu.tsx

@@ -1,5 +1,5 @@
 import React from "react";
-import { Plus } from "lucide-react-native";
+import Plus from "lucide-react-native/icons/plus";
 import { cn } from "../../../lib/utils";
 import { Button } from "../button";
 import * as DropdownMenu from "../dropdown-menu";

package/src/components/ui/prompt-input/attachments.tsx

@@ -1,15 +1,13 @@
 import React from "react";
 import { View, Pressable, ScrollView, ActivityIndicator } from "react-native";
 import { Image } from "expo-image";
-import {
-  FileText,
-  FileSpreadsheet,
-  FileCode,
-  FileArchive,
-  FileAudio,
-  File,
-  X,
-} from "lucide-react-native";
+import FileText from "lucide-react-native/icons/file-text";
+import FileSpreadsheet from "lucide-react-native/icons/file-spreadsheet";
+import FileCode from "lucide-react-native/icons/file-code";
+import FileArchive from "lucide-react-native/icons/file-archive";
+import FileHeadphone from "lucide-react-native/icons/file-headphone";
+import File from "lucide-react-native/icons/file";
+import X from "lucide-react-native/icons/x";
 import { Text } from "../text";
 import { formatFileSize } from "../../../lib/utils";
 import { usePromptInput, type Attachment } from "./context";
@@ -48,7 +46,7 @@ function getDocumentIcon(mimeType: string, name: string) {
     mimeType.startsWith("audio/") ||
     ["mp3", "wav", "ogg", "flac", "aac"].includes(ext)
   )
-    return { Icon: FileAudio, color: "#EC4899", bgColor: "#EC489918" };
+    return { Icon: FileHeadphone, color: "#EC4899", bgColor: "#EC489918" };
   if (
     mimeType === "text/plain" ||
     ["txt", "md", "rtf"].includes(ext)

package/src/components/ui/prompt-input/mic-button.tsx

@@ -1,6 +1,7 @@
 import React, { useEffect } from "react";
 import { Pressable, ActivityIndicator } from "react-native";
-import { Mic, MicOff } from "lucide-react-native";
+import Mic from "lucide-react-native/icons/mic";
+import MicOff from "lucide-react-native/icons/mic-off";
 import { cn } from "../../../lib/utils";
 import { useSpeechToText } from "../../../hooks/useSpeechToText";
 import { usePromptInput } from "./context";

package/src/components/ui/prompt-input/prompt-input.tsx

@@ -6,7 +6,8 @@ import {
   type ViewStyle,
 } from "react-native";
 import { KeyboardAvoidingView } from "../../../lib/keyboard";
-import { Maximize2, Minimize2 } from "lucide-react-native";
+import Maximize2 from "lucide-react-native/icons/maximize-2";
+import Minimize2 from "lucide-react-native/icons/minimize-2";
 import { cn } from "../../../lib/utils";
 import { PromptInputContext, type Attachment, type Completion } from "./context";
 import { PromptInputTextarea } from "./textarea";

package/src/components/ui/prompt-input/submit-button.tsx

@@ -1,5 +1,6 @@
 import React from "react";
-import { ArrowUp, Square } from "lucide-react-native";
+import ArrowUp from "lucide-react-native/icons/arrow-up";
+import Square from "lucide-react-native/icons/square";
 import { cn } from "../../../lib/utils";
 import { Button } from "../button";
 import { usePromptInput } from "./context";

package/src/components/voice/VoiceControls.tsx

@@ -4,7 +4,10 @@
  */
 
 import { View, Text, Pressable, ActivityIndicator, StyleSheet } from 'react-native';
-import { Mic, MicOff, PhoneOff, Users } from 'lucide-react-native';
+import Mic from 'lucide-react-native/icons/mic';
+import MicOff from 'lucide-react-native/icons/mic-off';
+import PhoneOff from 'lucide-react-native/icons/phone-off';
+import Users from 'lucide-react-native/icons/users';
 import type { RoomState, AgentState } from '../../types';
 
 interface VoiceControlsProps {