@memori.ai/memori-react 9.0.0-alpha.20 → 9.0.0-alpha.21

package/esm/version.d.ts

@@ -1 +1 @@
-export declare const version = "9.0.0-alpha.20";
+export declare const version = "9.0.0-alpha.21";

package/esm/version.js

@@ -1,2 +1,2 @@
-export const version = '9.0.0-alpha.20';
+export const version = '9.0.0-alpha.21';
 //# sourceMappingURL=version.js.map

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "9.0.0-alpha.20",
+  "version": "9.0.0-alpha.21",
   "name": "@memori.ai/memori-react",
   "author": "Memori Srl",
   "main": "dist/index.js",

package/src/components/Avatar/AvatarView/AvatarComponent/components/FullbodyAvatar/fullbodyAvatar.tsx

@@ -9,7 +9,7 @@ import {
   ANIMATION_URLS,
   AVATAR_POSITION,
   AVATAR_ROTATION,
-  MALE_EXCLUDED_ANIMATIONS,
+  isMaleExcludedAnimation,
   SCALE_LERP_FACTOR,
 } from '../../constants';
 import DynamicShadow from '../../Shadow/DynamicShadow';
@@ -74,7 +74,7 @@ export function FullbodyAvatar({
 
     if (sex !== 'MALE') return clips;
 
-    return clips.filter(clip => !MALE_EXCLUDED_ANIMATIONS.has(clip.name));
+    return clips.filter(clip => !isMaleExcludedAnimation(clip.name));
   }, [baseAnimations, additionalAnimations, needsAdditionalAnimations, sex]);
 
   // Create animation actions from the merged animations

package/src/components/Avatar/AvatarView/AvatarComponent/constants.test.ts

@@ -0,0 +1,19 @@
+import { isMaleExcludedAnimation } from './constants';
+
+describe('isMaleExcludedAnimation', () => {
+  it('excludes the unnumbered Idle clip and its Blender duplicate', () => {
+    expect(isMaleExcludedAnimation('Idle')).toBe(true);
+    expect(isMaleExcludedAnimation('Idle_Armature.003')).toBe(true);
+  });
+
+  it('keeps numbered idle variants in the rotation', () => {
+    expect(isMaleExcludedAnimation('Idle1')).toBe(false);
+    expect(isMaleExcludedAnimation('Idle2')).toBe(false);
+    expect(isMaleExcludedAnimation('Idle3')).toBe(false);
+    expect(isMaleExcludedAnimation('Idle4')).toBe(false);
+    expect(isMaleExcludedAnimation('Idle5')).toBe(false);
+    expect(isMaleExcludedAnimation('Idle 1_Armature.003')).toBe(false);
+    expect(isMaleExcludedAnimation('Idle 2_Armature.003')).toBe(false);
+    expect(isMaleExcludedAnimation('Idle 3_Armature.003')).toBe(false);
+  });
+});

package/src/components/Avatar/AvatarView/AvatarComponent/constants.ts

@@ -113,11 +113,14 @@ export const ANIMATION_URLS = {
     'https://assets.memori.ai/api/v2/asset/2adc934b-24b2-45bd-94ad-ffec58d3cb32.glb',
 };
 
-/** Idle clips excluded from the male animation pack. */
-export const MALE_EXCLUDED_ANIMATIONS = new Set([
-  'Idle',
-  'Idle2'
-]);
+/**
+ * Unnumbered Idle clips excluded from the male animation pack.
+ * Matches `Idle` and Blender duplicates like `Idle_Armature.003`,
+ * but not numbered variants (`Idle1`, `Idle3`, `Idle 1_Armature.003`, ...).
+ */
+export function isMaleExcludedAnimation(clipName: string): boolean {
+  return /^Idle(?!\d| \d)/.test(clipName);
+}
 
 // Blink configuration
 export const BLINK_CONFIG = {
@@ -138,4 +141,4 @@ export const DEFAULT_CONFIG: AnimationConfig = {
 export const EMOTION_SMOOTHING = 0.3;
 export const VISEME_SMOOTHING = 0.5;
 /** Multiplier applied to emotion morph target values before clamping (1 = raw mapping). */
-export const EMOTION_INTENSITY = 2.5;
+export const EMOTION_INTENSITY = 1.5;

package/src/components/ChatInputs/ChatInputs.tsx

@@ -374,6 +374,7 @@ ${text}
               removeFile={removeFile}
               showAnonymousRetentionNotice={!authToken}
               uploadingCount={uploadingCount}
+              maxDocumentsPerMessage={maxDocumentsPerMessage}
             />
           </div>
         )}

package/src/components/ContentPreviewModal/ContentPreviewModal.css

@@ -32,12 +32,18 @@
 }
 
 .memori-modal__viewport.memori-content-preview-modal .memori-modal__title {
+    overflow: hidden;
+    min-width: 0;
+    max-width: 100%;
     padding: 1rem 1.25rem 0.75rem;
+    padding-right: calc(var(--memori-icon-button-size, 40px) + 1.5rem);
     border-bottom: 1px solid var(--memori-content-preview-border, rgba(0, 0, 0, 0.06));
     color: var(--memori-text-color);
     font-size: var(--memori-text-size-base);
     font-weight: var(--memori-text-weight-semibold);
     letter-spacing: -0.01em;
+    text-overflow: ellipsis;
+    white-space: nowrap;
 }
 
 .memori-modal__viewport.memori-content-preview-modal .memori-modal__close {
@@ -45,28 +51,6 @@
     right: 0.75rem;
 }
 
-.memori-modal__viewport.memori-content-preview-modal .memori-modal__close button {
-    border-radius: var(--memori-radius-box);
-    background: var(--memori-content-preview-close-bg, rgba(0, 0, 0, 0.05));
-    color: var(--memori-text-color, #111827);
-    transition: background 0.2s ease, transform 0.15s ease;
-}
-
-.memori-modal__viewport.memori-content-preview-modal .memori-modal__close button svg {
-    color: currentColor;
-}
-
-.memori-modal__viewport.memori-content-preview-modal .memori-modal__close button:hover {
-    background: var(--memori-content-preview-close-hover, rgba(0, 0, 0, 0.1));
-    transform: scale(1.05);
-}
-
-[data-theme='dark'] .memori-modal__viewport.memori-content-preview-modal .memori-modal__close button,
-.memori-widget[data-theme='dark'] .memori-modal__viewport.memori-content-preview-modal .memori-modal__close button {
-    background: color-mix(in srgb, var(--memori-main-background, #111) 85%, white);
-    color: var(--memori-text-color, #fff);
-}
-
 .memori-content-preview-modal--body--image {
     display: flex;
     align-items: center;

package/src/components/FilePreview/FilePreview.css

@@ -1,6 +1,7 @@
 /* Updated FilePreview Styles */
 
 .memori--preview-container {
+    position: relative;
     z-index: 10;
     overflow: hidden;
     width: 100%;
@@ -12,6 +13,46 @@
     transition: all 0.3s ease;
 }
 
+.memori--preview-list {
+    display: flex;
+    width: 100%;
+    min-width: 0;
+    max-width: 100%;
+    box-sizing: border-box;
+    flex-direction: row;
+    flex-wrap: nowrap;
+    padding: 0.875rem;
+    padding-bottom: 0.625rem;
+    gap: 8px;
+    -webkit-overflow-scrolling: touch;
+    overflow-x: auto;
+    overflow-y: hidden;
+    overscroll-behavior-x: contain;
+    scrollbar-color: hsla(var(--border-300) / 35%) transparent;
+    scrollbar-width: thin;
+    touch-action: pan-x;
+}
+
+.memori--document-count {
+    position: absolute;
+    z-index: 5;
+    top: 8px;
+    right: 8px;
+    padding: calc(var(--memori-spacing-xs) / 4) calc(var(--memori-spacing-xs) + 2px);
+    border-radius: var(--memori-radius-box);
+    color: var(--memori-text-color);
+    font-size: 12px;
+    font-weight: bold;
+}
+
+.memori--document-count-full {
+    background-color: #fa5252;
+}
+
+.memori--preview-container:has(.memori--document-count) .memori--preview-list {
+    padding-right: 2.75rem;
+}
+
 .memori--preview-container.slide-down {
     animation: slide-down 0.3s ease;
 }
@@ -106,26 +147,6 @@
     margin: calc(var(--memori-spacing-sm) + var(--memori-spacing-xs)) 0;
 }
 
-.memori--preview-list {
-    display: flex;
-    width: 100%;
-    min-width: 0;
-    max-width: 100%;
-    box-sizing: border-box;
-    flex-direction: row;
-    flex-wrap: nowrap;
-    padding: 0.875rem;
-    padding-bottom: 0.625rem;
-    gap: 8px;
-    -webkit-overflow-scrolling: touch;
-    overflow-x: auto;
-    overflow-y: hidden;
-    overscroll-behavior-x: contain;
-    scrollbar-color: hsla(var(--border-300) / 35%) transparent;
-    scrollbar-width: thin;
-    touch-action: pan-x;
-}
-
 .memori--preview-item {
     position: relative;
     display: flex;

package/src/components/FilePreview/FilePreview.tsx

@@ -11,6 +11,8 @@ import {
 } from '../../helpers/utils';
 import { getDocumentBadgeLabel } from '../MediaWidget/MediaItemWidget.utils';
 import { useTranslation } from 'react-i18next';
+import cx from 'classnames';
+import { maxDocumentsPerMessage as defaultMaxDocumentsPerMessage } from '../../helpers/constants';
 
 type FilePreviewProps = {
   previewFiles: any;
@@ -18,6 +20,7 @@ type FilePreviewProps = {
   allowRemove?: boolean;
   showAnonymousRetentionNotice?: boolean;
   uploadingCount?: number;
+  maxDocumentsPerMessage?: number;
 };
 
 const FilePreview = ({
@@ -26,6 +29,7 @@ const FilePreview = ({
   allowRemove = true,
   showAnonymousRetentionNotice = false,
   uploadingCount = 0,
+  maxDocumentsPerMessage = defaultMaxDocumentsPerMessage,
 }: FilePreviewProps) => {
   const { t } = useTranslation();
   const [selectedFile, setSelectedFile] = useState<{
@@ -152,6 +156,16 @@ const FilePreview = ({
     <>
       {(previewFiles.length > 0 || uploadingCount > 0) && (
         <div className="memori--preview-container">
+          {previewFiles.length > 0 && (
+            <div
+              className={cx('memori--document-count', {
+                'memori--document-count-full':
+                  previewFiles.length >= maxDocumentsPerMessage,
+              })}
+            >
+              {previewFiles.length}/{maxDocumentsPerMessage}
+            </div>
+          )}
           {showAnonymousRetentionNotice && (
             <small
               style={{

package/src/components/FilePreview/__snapshots__/FilePreview.test.tsx.snap

@@ -7,6 +7,13 @@ exports[`renders FilePreview with one file 1`] = `
   <div
     class="memori--preview-container"
   >
+    <div
+      class="memori--document-count"
+    >
+      1
+      /
+      10
+    </div>
     <div
       class="memori--preview-list"
     >
@@ -95,6 +102,13 @@ exports[`renders FilePreview with two files 1`] = `
   <div
     class="memori--preview-container"
   >
+    <div
+      class="memori--document-count"
+    >
+      2
+      /
+      10
+    </div>
     <div
       class="memori--preview-list"
     >

package/src/components/KnownFacts/KnownFacts.tsx

@@ -213,7 +213,6 @@ const KnownFacts = ({
             <>
               <Button
                 variant="ghost"
-                danger
                 onClick={() => {
                   setBulkDeleteModalVisible(false);
                   setBulkDeleteIds([]);
@@ -341,7 +340,6 @@ const KnownFacts = ({
             <>
               <Button
                 variant="ghost"
-                danger
                 onClick={() => {
                   setDeleteModalVisibleFor(undefined);
                 }}

package/src/components/MediaWidget/MediaPreviewModal.test.tsx

@@ -259,9 +259,8 @@ describe('MediaPreviewModal', () => {
       render(
         <MediaPreviewModal medium={medium} onClose={onClose} />
       );
-      const closeWrapper = document.querySelector('.memori-modal__close');
-      expect(closeWrapper).toBeInTheDocument();
-      const closeButton = closeWrapper?.querySelector('button');
+      const closeButton = document.querySelector('.memori-modal__close');
+      expect(closeButton).toBeInTheDocument();
       if (closeButton) {
         fireEvent.click(closeButton);
         expect(onClose).toHaveBeenCalled();

package/src/components/MemoriArtifactSystem/components/ArtifactActions/ArtifactActions.tsx

@@ -4,16 +4,12 @@
  * Following the project's component patterns and design system
  */
 
-import React, { useState, useCallback } from 'react';
+import React, { useCallback } from 'react';
 import { useTranslation } from 'react-i18next';
-import cx from 'classnames';
 import { Button, Dropdown } from '@memori.ai/ui';
 import { ArtifactData } from '../../types/artifact.types';
 import {
-  Download,
   Link as LinkIcon,
-  Maximize,
-  Minimize,
   Printer,
   MoreVertical,
 } from 'lucide-react';
@@ -186,7 +182,7 @@ const ArtifactActions: React.FC<{
           loading={loading}
           className="memori-artifact-action-btn"
         />
-       {isMobile && (
+        {isMobile && (
           <Dropdown className="memori-copy-menu-wrapper">
             <Dropdown.Trigger
               showChevron={false}
@@ -202,33 +198,23 @@ const ArtifactActions: React.FC<{
                 </Button>
               )}
             />
-            <Dropdown.Menu className="memori-copy-dropdown" style={{ minWidth: '200px' }}>
-              <div className="memori-copy-dropdown-list">
-                <Button
-                  onClick={handlePrint}
-                  disabled={loading}
-                  className="memori-artifact-action-btn memori-artifact-action-btn--print"
-                  variant="ghost"
-                  icon={<Printer className="memori-artifact-action-icon" />}
-                  title={t('artifact.print') || 'Print'}
-                >
-                  <span className="memori-artifact-action-text">
-                    {t('artifact.print') || 'Print'}
-                  </span>
-                </Button>
-                <Button
-                  onClick={handleOpenExternal}
-                  disabled={loading}
-                  className="memori-artifact-action-btn memori-artifact-action-btn--external"
-                  variant="ghost"
-                  icon={<LinkIcon className="memori-artifact-action-icon" />}
-                  title={t('artifact.external') || 'External'}
-                >
-                  <span className="memori-artifact-action-text">
-                    {t('artifact.external') || 'External'}
-                  </span>
-                </Button>
-              </div>
+            <Dropdown.Menu placement="bottom" align="end" sideOffset={8}>
+              <Dropdown.Item
+                onClick={handlePrint}
+                disabled={loading}
+                icon={<Printer />}
+                label={t('artifact.print') || 'Print'}
+              >
+                {t('artifact.print') || 'Print'}
+              </Dropdown.Item>
+              <Dropdown.Item
+                onClick={handleOpenExternal}
+                disabled={loading}
+                icon={<LinkIcon />}
+                label={t('artifact.external') || 'External'}
+              >
+                {t('artifact.external') || 'External'}
+              </Dropdown.Item>
             </Dropdown.Menu>
           </Dropdown>
         )}

package/src/components/MemoriArtifactSystem/components/ArtifactActions/components/CopyButtonWithDropdown.tsx

@@ -1,14 +1,13 @@
 /**
  * CopyButtonWithDropdown - Main component with dropdown menu
- * Similar to Claude's copy system with format-specific options using headless-ui
+ * Similar to Claude's copy system with format-specific options
  */
 /* eslint-disable react/prop-types -- props validated by CopyButtonWithDropdownProps (TypeScript) */
 
-import React, { useRef, useEffect, useCallback } from 'react';
+import React, { useCallback } from 'react';
 import cx from 'classnames';
 import { CopyButtonWithDropdownProps, CopyFormat } from '../types';
 import { useCopyArtifact } from '../hooks/useCopyArtifact';
-import CopyMenuItem from './CopyMenuItem';
 import { Button, Dropdown } from '@memori.ai/ui';
 import {
   Copy,
@@ -22,8 +21,20 @@ import {
 import { useTranslation } from 'react-i18next';
 import { marked } from 'marked';
 import DOMPurify from 'dompurify';
-import { ArtifactData } from '../../../types/artifact.types';
 
+const getCopyActionIcon = (action: CopyFormat['action']) => {
+  switch (action) {
+    case 'pdf':
+    case 'download':
+      return <Download />;
+    case 'print':
+      return <Printer />;
+    case 'link':
+      return <LinkIcon />;
+    default:
+      return <Copy />;
+  }
+};
 
 const CopyButtonWithDropdown: React.FC<CopyButtonWithDropdownProps> = ({
   artifact,
@@ -412,47 +423,35 @@ const CopyButtonWithDropdown: React.FC<CopyButtonWithDropdownProps> = ({
                 </Button>
               )}
             />
-            <Dropdown.Menu className="memori-copy-dropdown">
-              <div className="memori-copy-dropdown-content">
-                <div className="memori-copy-dropdown-list">
-                  {formats.map(format => (
-                    <Dropdown.Item key={format.id}>
-                      <CopyMenuItem
-                        format={format}
-                        onClick={handleFormatSelect}
-                        loading={copyState.loading}
-                        active={false}
-                      />
-                    </Dropdown.Item>
-                  ))}
-                  <Dropdown.Item>
-                    <CopyMenuItem
-                      format={{
-                        id: 'external',
-                        label: t('artifact.external') || 'External',
-                        action: 'link',
-                        mimeType: artifact.mimeType,
-                      }}
-                      onClick={handleOpenExternal}
-                      loading={copyState.loading}
-                      active={false}
-                    />
-                  </Dropdown.Item>
-                  <Dropdown.Item>
-                    <CopyMenuItem
-                      format={{
-                        id: 'print',
-                        label: t('artifact.print') || 'Print',
-                        action: 'print',
-                        mimeType: artifact.mimeType,
-                      }}
-                      onClick={handlePrint}
-                      loading={copyState.loading}
-                      active={false}
-                    />
-                  </Dropdown.Item>
-                </div>
-              </div>
+            <Dropdown.Menu placement="bottom" align="end" sideOffset={8}>
+              {formats.map(format => (
+                <Dropdown.Item
+                  key={format.id}
+                  onClick={() => handleFormatSelect(format)}
+                  disabled={copyState.loading}
+                  icon={getCopyActionIcon(format.action)}
+                  label={format.label}
+                >
+                  {format.label}
+                </Dropdown.Item>
+              ))}
+              <Dropdown.Separator />
+              <Dropdown.Item
+                onClick={handleOpenExternal}
+                disabled={copyState.loading}
+                icon={getCopyActionIcon('link')}
+                label={t('artifact.external') || 'External'}
+              >
+                {t('artifact.external') || 'External'}
+              </Dropdown.Item>
+              <Dropdown.Item
+                onClick={handlePrint}
+                disabled={copyState.loading}
+                icon={getCopyActionIcon('print')}
+                label={t('artifact.print') || 'Print'}
+              >
+                {t('artifact.print') || 'Print'}
+              </Dropdown.Item>
             </Dropdown.Menu>
           </Dropdown>
         )}

package/src/components/MemoriArtifactSystem/components/ArtifactActions/styles.css

@@ -175,7 +175,7 @@
 /* Copy Menu Wrapper */
 .memori-copy-menu-wrapper {
     position: relative;
-    z-index: 10001;
+    z-index: 10;
     display: inline-block;
 }
 
@@ -183,96 +183,6 @@
     gap: var(--memori-spacing-sm);
 }
 
-/* Copy Dropdown */
-.memori-copy-dropdown {
-    position: absolute;
-    z-index: 10001;
-    top: 100%;
-    right: 0;
-    /* left: 0; */
-    overflow: hidden;
-    min-width: 280px;
-    max-width: 320px;
-    border: 1px solid var(--memori-copy-border);
-    border: var(--memori-border) solid var(--memori-border-color);
-    border-radius: 0.5rem;
-    margin-top: var(--memori-spacing-xs);
-    background: var(--memori-secondary-background);
-    box-shadow: var(--memori-copy-shadow);
-}
-
-/* Responsive positioning */
-@media (max-width: 640px) {
-    .memori-copy-dropdown {
-        right: 0;
-        left: auto;
-        min-width: 260px;
-        max-width: calc(100vw - var(--memori-spacing-xl));
-    }
-}
-
-/* Headless UI Transition Classes */
-.memori-copy-dropdown-enter {
-    transition: all 0.15s ease-out;
-}
-
-.memori-copy-dropdown-enter-from {
-    opacity: 0;
-    transform: translateY(-8px) scale(0.95);
-}
-
-.memori-copy-dropdown-enter-to {
-    opacity: 1;
-    transform: translateY(0) scale(1);
-}
-
-.memori-copy-dropdown-leave {
-    transition: all 0.1s ease-in;
-}
-
-.memori-copy-dropdown-leave-from {
-    opacity: 1;
-    transform: translateY(0) scale(1);
-}
-
-.memori-copy-dropdown-leave-to {
-    opacity: 0;
-    transform: translateY(-8px) scale(0.95);
-}
-
-.memori-copy-dropdown-content {
-    padding: var(--memori-spacing-sm) 0;
-}
-
-.memori-copy-dropdown-header {
-    padding: var(--memori-spacing-sm) var(--memori-spacing-md) var(--memori-spacing-xs);
-    border-bottom: 1px solid var(--memori-copy-border);
-    margin-bottom: var(--memori-spacing-xs);
-}
-
-.memori-copy-dropdown-title {
-    color: var(--memori-text-color);
-    font-size: 0.75rem;
-    font-weight: var(--memori-text-weight-semibold);
-    letter-spacing: 0.05em;
-    text-transform: uppercase;
-}
-
-.memori-copy-dropdown-list {
-    max-height: 300px;
-    overflow-y: auto;
-}
-
-.memori-copy-dropdown-empty {
-    padding: var(--memori-spacing-md);
-    text-align: center;
-}
-
-.memori-copy-dropdown-empty-text {
-    color: var(--memori-text-color);
-    font-size: var(--memori-text-size-small);
-}
-
 /* Copy Menu Item */
 .memori-copy-menu-item {
     position: relative;
@@ -441,11 +351,6 @@
 
 /* Responsive Design */
 @media (max-width: 640px) {
-    .memori-copy-dropdown {
-        min-width: 260px;
-        max-width: calc(100vw - var(--memori-spacing-xl));
-    }
-
     .memori-copy-toast {
         right: var(--memori-spacing-md);
         left: var(--memori-spacing-md);
@@ -468,7 +373,6 @@
 /* Print Media Queries */
 @media print {
     .memori-copy-button-wrapper,
-    .memori-copy-dropdown,
     .memori-copy-toast {
         display: none !important;
     }
@@ -480,10 +384,6 @@
         border-width: 2px;
     }
 
-    .memori-copy-dropdown {
-        border-width: 2px;
-    }
-
     .memori-copy-menu-item:hover:not(:disabled) {
         background: var(--memori-copy-surface-pressed);
         color: var(--memori-text-color);
@@ -494,7 +394,6 @@
 @media (prefers-reduced-motion: reduce) {
     .memori-copy-button,
     .memori-copy-menu-item,
-    .memori-copy-dropdown,
     .memori-copy-toast {
         transition: none;
     }
@@ -504,10 +403,6 @@
         animation: none;
     }
 
-    .memori-copy-dropdown {
-        animation: none;
-    }
-
     .memori-copy-toast {
         animation: none;
     }