@memori.ai/memori-react 9.0.0-alpha.6 → 9.0.0-alpha.8

package/esm/components/layouts/WebsiteAssistant/website-assistant.css

@@ -195,6 +195,15 @@
     pointer-events: all;
 }
 
+/*
+ * Keep in sync with ArtifactDrawer split width (46% / --memori-modal-size-md override).
+ * Same pairing as HiddenChat's `.memori-sidebar-toggle-artifact` → `right: 46%`.
+ */
+.memori-widget.memori-layout-website_assistant
+    .memori-website_assistant--expanded.memori-website_assistant--artifact-open {
+    right: 46%;
+}
+
 /* Tablet */
 @media (min-width: 601px) {
     .memori-widget.memori-layout-website_assistant .memori-website_assistant--collapsed,
@@ -205,6 +214,11 @@
         border-radius: var(--memori-radius-box) 0 0 0;
     }
 
+    .memori-widget.memori-layout-website_assistant
+        .memori-website_assistant--expanded.memori-website_assistant--artifact-open {
+        right: 46%;
+    }
+
     .memori-widget.memori-layout-website_assistant .memori-website_assistant--expanded {
         height: min(75vh, calc(100vh - var(--memori-spacing-5xl)));
     }
@@ -218,6 +232,11 @@
         border-radius: var(--memori-radius-box) 0 0 0;
     }
 
+    .memori-widget.memori-layout-website_assistant
+        .memori-website_assistant--expanded.memori-website_assistant--artifact-open {
+        right: 46%;
+    }
+
     .memori-widget.memori-layout-website_assistant .memori-website_assistant--expanded {
         height: 100vh;
         border-radius: 0;

package/esm/components/layouts/chat.css

@@ -8,7 +8,8 @@
     background: none;
 }
 
-.memori-widget > .memori-spin.memori-chat-layout {
+.memori-widget > .memori-spin.memori-chat-layout,
+.memori-widget > .memori-widget__surface > .memori-spin.memori-chat-layout {
     display: flex;
     overflow: hidden;
     height: 100%;

package/esm/components/layouts/fullpage.css

@@ -9,11 +9,13 @@
     margin-left: auto;
 }
 
-.memori-widget.memori-layout-fullpage > .memori-spin {
+.memori-widget.memori-layout-fullpage > .memori-spin,
+.memori-widget.memori-layout-fullpage > .memori-widget__surface > .memori-spin {
     display: flex;
-    height: calc(100vh - 50px);
-    height: calc(100dvh - 50px);
+    overflow: hidden;
+    height: 100%;
     min-height: 0;
+    flex: 1 1 auto;
     flex-direction: column;
     gap: 0;
 }
@@ -156,7 +158,7 @@
     display: flex;
     overflow: hidden;
     min-height: 0;
-    flex: 1 1 auto;
+    flex: 1 1 0%;
     flex-direction: row;
     align-items: stretch;
 }
@@ -168,7 +170,7 @@
     max-width: var(--memori-layout-max-width);
     height: 100%;
     min-height: 0;
-    flex: 1 1 auto;
+    flex: 1 1 0%;
     align-items: stretch;
     justify-content: center;
     padding: 0 var(--memori-spacing-md) var(--memori-spacing-md);
@@ -179,10 +181,16 @@
 }
 
 .memori-widget.memori-layout-fullpage .memori--grid-column-left {
+    display: flex;
     overflow: hidden;
     width: 50%;
     max-width: 420px;
+    height: 100%;
+    min-height: 0;
+    flex-direction: column;
     flex-shrink: 0;
+    align-items: stretch;
+    align-self: stretch;
     border: 1px solid color-mix(in srgb, var(--memori-text-color, #111827) 10%, transparent);
     border-radius: 0.9rem;
     margin-right: 0;
@@ -191,23 +199,35 @@
 }
 
 .memori-widget.memori-layout-fullpage .memori--grid-column-left .memori--avatar-wrapper {
-    align-items: flex-start;
-    padding-top: clamp(1.25rem, 3vw, 2rem);
+    position: relative;
+    display: flex;
+    width: 100%;
+    height: 100%;
+    min-height: 0;
+    flex: 1 1 0%;
+    align-items: stretch;
+    justify-content: center;
+    padding-top: 0;
 }
 
 .memori-widget.memori-layout-fullpage .memori--grid-column-left .memori--avatar-wrapper model-viewer,
 .memori-widget.memori-layout-fullpage .memori--grid-column-left .memori--avatar-wrapper canvas,
 .memori-widget.memori-layout-fullpage .memori--grid-column-left .memori--avatar-wrapper > div {
+    width: 100% !important;
     max-width: 100%;
+    height: 100% !important;
+    max-height: 100%;
 }
 
 .memori-widget.memori-layout-fullpage .memori-chat-layout--main {
     display: flex;
     min-width: 0;
+    height: 100%;
     min-height: 0;
     flex: 1;
     flex-direction: column;
     align-items: stretch;
+    align-self: stretch;
     justify-content: stretch;
 }
 
@@ -247,7 +267,7 @@
     height: 100%;
     min-height: 0;
     max-height: 100%;
-    flex: 1 1 auto;
+    flex: 1 1 0%;
     flex-direction: column;
     align-items: stretch;
     padding: 0;
@@ -255,10 +275,13 @@
 
 .memori-widget.memori-layout-fullpage .memori-chat-layout--controls .memori--start-panel,
 .memori-widget.memori-layout-fullpage .memori-chat-layout--controls .memori-chat--wrapper {
+    display: flex;
     width: 100%;
     max-width: 100%;
     height: 100%;
     min-height: 0;
+    flex: 1 1 0%;
+    flex-direction: column;
     padding: 0 !important;
     margin-right: 0;
     margin-left: 0;

package/esm/components/layouts/hidden-chat.css

@@ -192,6 +192,7 @@
     right: 0;
 }
 
+/* Keep in sync with ArtifactDrawer split width (46% / --memori-modal-size-md override) */
 .memori-sidebar-toggle-artifact:checked ~ .memori-sidebar-container .memori-sidebar {
     right: 46%;
 }
@@ -513,9 +514,3 @@
     border: var(--memori-border) solid #fff;
     color: #fff;
 }
-
-.memori-widget.memori-layout-hidden_chat[data-theme='dark'] .memori-hidden-chat-layout--overflow-trigger,
-[data-theme='dark'] .memori-widget.memori-layout-hidden_chat .memori-hidden-chat-layout--overflow-trigger {
-    border: var(--memori-border) solid #fff;
-    color: #fff;
-}

package/esm/components/layouts/totem.css

@@ -6,7 +6,8 @@
     background: linear-gradient(#333, #eee);
 }
 
-.memori-widget > .memori-spin.memori-totem-layout {
+.memori-widget > .memori-spin.memori-totem-layout,
+.memori-widget > .memori-widget__surface > .memori-spin.memori-totem-layout {
     display: flex;
     height: 100%;
     flex-direction: column;

package/esm/components/layouts/zoomed-full-body.css

@@ -17,21 +17,30 @@
     margin-left: auto;
 }
 
-.memori-widget.memori-layout-zoomed_full_body > .memori-spin {
+.memori-widget.memori-layout-zoomed_full_body > .memori-spin,
+.memori-widget.memori-layout-zoomed_full_body > .memori-widget__surface > .memori-spin {
     display: flex;
-    height: calc(100vh - 50px);
-    height: calc(100dvh - 50px);
+    overflow: hidden;
+    height: 100%;
     min-height: 0;
+    flex: 1 1 auto;
     flex-direction: column;
     gap: 0;
 }
 
-/* 3D avatar: pin “Powered by” to the corner so it clears the figure */
+/* 3D avatar: pin “Powered by” to the corner so it clears the figure.
+   Order: lower-specificity (no surface) first, then surface variants
+   (stylelint no-descending-specificity). */
 .memori-widget.memori-layout-zoomed_full_body > .memori-spin > .memori--powered-by,
 .memori-widget.memori-layout-zoomed_full_body.memori--avatar-readyplayerme > .memori-spin > .memori--powered-by,
 .memori-widget.memori-layout-zoomed_full_body.memori--avatar-readyplayerme-full > .memori-spin > .memori--powered-by,
 .memori-widget.memori-layout-zoomed_full_body.memori--avatar-customglb > .memori-spin > .memori--powered-by,
-.memori-widget.memori-layout-zoomed_full_body.memori--avatar-customrpm > .memori-spin > .memori--powered-by {
+.memori-widget.memori-layout-zoomed_full_body.memori--avatar-customrpm > .memori-spin > .memori--powered-by,
+.memori-widget.memori-layout-zoomed_full_body > .memori-widget__surface > .memori-spin > .memori--powered-by,
+.memori-widget.memori-layout-zoomed_full_body.memori--avatar-readyplayerme > .memori-widget__surface > .memori-spin > .memori--powered-by,
+.memori-widget.memori-layout-zoomed_full_body.memori--avatar-readyplayerme-full > .memori-widget__surface > .memori-spin > .memori--powered-by,
+.memori-widget.memori-layout-zoomed_full_body.memori--avatar-customglb > .memori-widget__surface > .memori-spin > .memori--powered-by,
+.memori-widget.memori-layout-zoomed_full_body.memori--avatar-customrpm > .memori-widget__surface > .memori-spin > .memori--powered-by {
     bottom: 3.5rem;
     left: 1.5rem;
 }
@@ -158,10 +167,16 @@
 }
 
 .memori-widget.memori-layout-zoomed_full_body .memori--grid-column-left {
+    display: flex;
     overflow: hidden;
     width: 50%;
     max-width: 420px;
+    height: 100%;
+    min-height: 0;
+    flex-direction: column;
     flex-shrink: 0;
+    align-items: stretch;
+    align-self: stretch;
     border: 1px solid color-mix(in srgb, var(--memori-text-color, #111827) 10%, transparent);
     border-radius: 0.9rem;
     margin-right: 0;
@@ -170,14 +185,24 @@
 }
 
 .memori-widget.memori-layout-zoomed_full_body .memori--grid-column-left .memori--avatar-wrapper {
-    align-items: flex-start;
-    padding-top: clamp(1.25rem, 3vw, 2rem);
+    position: relative;
+    display: flex;
+    width: 100%;
+    height: 100%;
+    min-height: 0;
+    flex: 1 1 0%;
+    align-items: stretch;
+    justify-content: center;
+    padding-top: 0;
 }
 
 .memori-widget.memori-layout-zoomed_full_body .memori--grid-column-left .memori--avatar-wrapper model-viewer,
 .memori-widget.memori-layout-zoomed_full_body .memori--grid-column-left .memori--avatar-wrapper canvas,
 .memori-widget.memori-layout-zoomed_full_body .memori--grid-column-left .memori--avatar-wrapper > div {
+    width: 100% !important;
     max-width: 100%;
+    height: 100% !important;
+    max-height: 100%;
 }
 
 .memori-widget.memori-layout-zoomed_full_body .memori-chat-layout--main {

package/esm/context/widgetSurfaceContext.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+export declare const WidgetSurfaceProvider: React.Provider<HTMLElement | null>;
+export declare function useWidgetSurfaceEl(): HTMLElement | null;

package/esm/context/widgetSurfaceContext.js

@@ -0,0 +1,7 @@
+import { createContext, useContext } from 'react';
+const WidgetSurfaceContext = createContext(null);
+export const WidgetSurfaceProvider = WidgetSurfaceContext.Provider;
+export function useWidgetSurfaceEl() {
+    return useContext(WidgetSurfaceContext);
+}
+//# sourceMappingURL=widgetSurfaceContext.js.map

package/esm/context/widgetSurfaceContext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"widgetSurfaceContext.js","sourceRoot":"","sources":["../../src/context/widgetSurfaceContext.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAOzD,MAAM,oBAAoB,GAAG,aAAa,CAAqB,IAAI,CAAC,CAAC;AAErE,MAAM,CAAC,MAAM,qBAAqB,GAAG,oBAAoB,CAAC,QAAQ,CAAC;AAEnE,MAAM,UAAU,kBAAkB;IAChC,OAAO,UAAU,CAAC,oBAAoB,CAAC,CAAC;AAC1C,CAAC"}

package/esm/helpers/positionPopover.d.ts

@@ -0,0 +1 @@
+export declare function shouldRestartSessionOnPositionPopoverClose(wasOpen: boolean, nextOpen: boolean, autoStart: boolean): boolean;

package/esm/helpers/positionPopover.js

@@ -0,0 +1,4 @@
+export function shouldRestartSessionOnPositionPopoverClose(wasOpen, nextOpen, autoStart) {
+    return wasOpen && !nextOpen && !!autoStart;
+}
+//# sourceMappingURL=positionPopover.js.map

package/esm/helpers/positionPopover.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"positionPopover.js","sourceRoot":"","sources":["../../src/helpers/positionPopover.ts"],"names":[],"mappings":"AAMA,MAAM,UAAU,0CAA0C,CACxD,OAAgB,EAChB,QAAiB,EACjB,SAAkB;IAElB,OAAO,OAAO,IAAI,CAAC,QAAQ,IAAI,CAAC,CAAC,SAAS,CAAC;AAC7C,CAAC"}