@streamsai/ui 0.1.2 → 0.1.4

package/dist/components/ui/rich-text-editor.d.ts

@@ -73,8 +73,6 @@ export type SlashCommandCandidate = {
     insertText?: string | null;
     /** Menu section; the menu lists `cycles` before `commands`. Ungrouped candidates show under one title. */
     group?: 'cycles' | 'commands';
-    /** Draws a soft sweeping highlight behind the row, to point a first-time user at it. */
-    emphasis?: boolean;
 };
 /** Host-supplied emoji for the `:` shortcode typeahead (Slack-style `:smile:`). */
 export type EmojiCandidate = {

package/dist/components/ui/rich-text-editor.js

@@ -21,8 +21,7 @@ import { $createLinkNode, $isLinkNode, LinkNode, AutoLinkNode } from '@lexical/l
 import { $createCodeNode, $isCodeNode, CodeNode } from '@lexical/code';
 import { BOLD_ITALIC_STAR, BOLD_ITALIC_UNDERSCORE, BOLD_STAR, BOLD_UNDERSCORE, CODE, INLINE_CODE, ITALIC_STAR, ITALIC_UNDERSCORE, LINK, ORDERED_LIST, STRIKETHROUGH, UNORDERED_LIST, } from '@lexical/markdown';
 import { cn } from '../../lib/utils.js';
-import { Collapse, motion, useReducedMotion } from '../../motion/index.js';
-import { loops } from '../../motion/config.js';
+import { Collapse } from '../../motion/index.js';
 import { detectTextDirection, hasStrongCharacter } from '../../lib/text-direction.js';
 import { AgentAvatar } from './agent-avatar.js';
 import { ProviderBadge } from './provider-badge.js';
@@ -1068,7 +1067,10 @@ function TypeaheadMenuAboveCaret({ anchor, dataAttr, className, children, option
             width: initialPlacement.width,
             // Beats `max-h-60` when the room above the menu is smaller than 240px.
             maxHeight: initialPlacement.maxHeight,
-        }, onScroll: onNearEnd
+        }, 
+        // A tap on a row must not move focus off the composer: on iOS that pulses the keyboard
+        // state for a moment (focusout, then focusin) and the message list behind it jumps.
+        onMouseDown: (event) => event.preventDefault(), onScroll: onNearEnd
             ? (event) => {
                 const el = event.currentTarget;
                 if (el.scrollTop + el.clientHeight >= el.scrollHeight - TYPEAHEAD_NEAR_END_PX) {
@@ -1400,22 +1402,13 @@ function SlashCommandsPlugin({ searchSlashCommands, onSelectCommand, onSlashType
                             : labels.slashTitle;
                     return (_jsxs(React.Fragment, { children: [startsGroup ? _jsx(SlashGroupHeader, { label: title, first: index === 0 }) : null, _jsxs("button", { id: `slash-typeahead-item-${index}`, type: "button", role: "option", tabIndex: -1, "aria-selected": selected, 
                                 // Lexical scrolls the highlighted row into the max-h menu via this ref.
-                                ref: option.setRefElement, className: cn('relative isolate flex w-full flex-col rounded-lg p-2 text-start text-sm in-data-[platform=mobile]:mb-0.5 in-data-[platform=mobile]:text-base', selected ? 'bg-accent text-accent-foreground' : 'hover:bg-accent'), onClick: () => {
+                                ref: option.setRefElement, className: cn('flex w-full flex-col rounded-lg p-2 text-start text-sm in-data-[platform=mobile]:mb-0.5 in-data-[platform=mobile]:text-base', selected ? 'bg-accent text-accent-foreground' : 'hover:bg-accent'), onClick: () => {
                                     setHighlightedIndex(index);
                                     selectOptionAndCleanUp(option);
-                                }, onMouseEnter: () => setHighlightedIndex(index), children: [option.candidate.emphasis ? _jsx(SlashEmphasis, {}) : null, _jsxs("span", { children: ["/", option.candidate.name] }), _jsx("span", { className: "text-muted-foreground", children: option.candidate.description })] })] }, option.key));
+                                }, onMouseEnter: () => setHighlightedIndex(index), children: [_jsxs("span", { children: ["/", option.candidate.name] }), _jsx("span", { className: "text-muted-foreground", children: option.candidate.description })] })] }, option.key));
                 })) }), document.body);
         } }));
 }
-/** A tinted wash with a light band sweeping across it; still (tint only) under reduced motion. */
-function SlashEmphasis() {
-    const reduceMotion = useReducedMotion();
-    return (_jsx(motion.span, { "aria-hidden": true, "data-slot": "slash-emphasis", className: "pointer-events-none absolute inset-0 -z-10 rounded-lg bg-primary/8", style: {
-            backgroundImage: 'linear-gradient(100deg, transparent 30%, color-mix(in oklab, var(--primary) 22%, transparent) 50%, transparent 70%)',
-            backgroundSize: '220% 100%',
-            backgroundRepeat: 'no-repeat',
-        }, initial: { backgroundPosition: '160% 0' }, animate: reduceMotion === true ? undefined : { backgroundPosition: ['160% 0', '-60% 0'] }, transition: { ...loops.shimmer, duration: 1.8 } }));
-}
 function SlashGroupHeader({ label, first }) {
     return (_jsxs("div", { className: cn('flex items-center gap-2.5 px-2 pb-1 text-sm text-muted-foreground', first ? 'pt-1.5' : 'pt-3'), children: [_jsx("span", { children: label }), _jsx("span", { className: "h-px flex-1 bg-border", "aria-hidden": true })] }));
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@streamsai/ui",
-  "version": "0.1.2",
+  "version": "0.1.4",
   "description": "Streams design system: shadcn/ui components on Base UI, design tokens (Tailwind v4) and a theme provider for React 19.",
   "license": "MIT",
   "repository": {