@memori.ai/memori-react 6.8.1 → 6.8.4

package/src/components/MediaWidget/__snapshots__/MediaItemWidget.test.tsx.snap

@@ -5,9 +5,6 @@ exports[`renders MediaItemWidget unchanged with css snippet to exec 1`] = `
   <div
     class="memori-media-items"
   >
-    <div
-      class="memori-media-items--grid"
-    />
     <style>
       body{
   background-color: #f00;
@@ -22,9 +19,6 @@ exports[`renders MediaItemWidget unchanged with css snippet to show 1`] = `
   <div
     class="memori-media-items"
   >
-    <div
-      class="memori-media-items--grid"
-    />
     <div
       class="memori-media-item--snippet ease-out duration-500 opacity-0 translate-y-1"
     >
@@ -36,86 +30,14 @@ exports[`renders MediaItemWidget unchanged with css snippet to show 1`] = `
         >
           <pre
             aria-labelledby="#snippet-65ca4a6d-f20b-402e-9d79-5e470f247927"
-            style="color: rgb(197, 200, 198); text-shadow: 0 1px rgba(0, 0, 0, 0.3); font-family: Inconsolata, Monaco, Consolas, 'Courier New', Courier, monospace; direction: ltr; text-align: left; white-space: pre; word-spacing: normal; word-break: normal; line-height: 1.5; tab-size: 4; hyphens: none; padding: 1em; margin: .5em 0px; overflow: auto; border-radius: 0.3em; background: rgb(29, 31, 33);"
+            class="line-numbers"
           >
             <code
               class="language-scss"
-              style="color: rgb(197, 200, 198); text-shadow: 0 1px rgba(0, 0, 0, 0.3); font-family: Inconsolata, Monaco, Consolas, 'Courier New', Courier, monospace; direction: ltr; text-align: left; white-space: pre; word-spacing: normal; word-break: normal; line-height: 1.5; tab-size: 4; hyphens: none;"
             >
-              <span
-                class="linenumber react-syntax-highlighter-line-number"
-                style="display: inline-block; min-width: 2.25em; padding-right: 1em; text-align: right; user-select: none; color: rgb(124, 124, 124);"
-              >
-                1
-              </span>
-              <span
-                class="token"
-                style="color: rgb(168, 255, 96);"
-              >
-                body
-              </span>
-              <span
-                class="token"
-                style="color: rgb(197, 200, 198);"
-              >
-                {
-              </span>
-              <span>
-                
-
-              </span>
-              <span
-                class="linenumber react-syntax-highlighter-line-number"
-                style="display: inline-block; min-width: 2.25em; padding-right: 1em; text-align: right; user-select: none; color: rgb(124, 124, 124);"
-              >
-                2
-              </span>
-              <span>
-                  
-              </span>
-              <span
-                class="token"
-                style="color: rgb(150, 203, 254);"
-              >
-                background-color
-              </span>
-              <span
-                class="token"
-                style="color: rgb(197, 200, 198);"
-              >
-                :
-              </span>
-              <span>
-                 
-              </span>
-              <span
-                class="token hexcode color"
-              >
-                #f00
-              </span>
-              <span
-                class="token"
-                style="color: rgb(197, 200, 198);"
-              >
-                ;
-              </span>
-              <span>
-                
-
-              </span>
-              <span
-                class="linenumber react-syntax-highlighter-line-number"
-                style="display: inline-block; min-width: 2.25em; padding-right: 1em; text-align: right; user-select: none; color: rgb(124, 124, 124);"
-              >
-                3
-              </span>
-              <span />
-              <span
-                class="token"
-                style="color: rgb(197, 200, 198);"
-              >
-                }
-              </span>
+              body{
+  background-color: #f00;
+}
             </code>
           </pre>
           <button
@@ -127,13 +49,26 @@ exports[`renders MediaItemWidget unchanged with css snippet to show 1`] = `
             >
               <svg
                 aria-hidden="true"
+                fill="none"
                 focusable="false"
                 role="img"
-                viewBox="0 0 1024 1024"
+                stroke="currentColor"
+                stroke-linecap="round"
+                stroke-linejoin="round"
+                stroke-width="1.5"
+                viewBox="0 0 24 24"
                 xmlns="http://www.w3.org/2000/svg"
               >
+                <rect
+                  height="14"
+                  rx="2"
+                  ry="2"
+                  width="14"
+                  x="8"
+                  y="8"
+                />
                 <path
-                  d="M832 64H296c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8h496v688c0 4.4 3.6 8 8 8h56c4.4 0 8-3.6 8-8V96c0-17.7-14.3-32-32-32zM704 192H192c-17.7 0-32 14.3-32 32v530.7c0 8.5 3.4 16.6 9.4 22.6l173.3 173.3c2.2 2.2 4.7 4 7.4 5.5v1.9h4.2c3.5 1.3 7.2 2 11 2H704c17.7 0 32-14.3 32-32V224c0-17.7-14.3-32-32-32zM350 856.2L263.9 770H350v86.2zM664 888H414V746c0-22.1-17.9-40-40-40H232V264h432v624z"
+                  d="M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2"
                 />
               </svg>
             </span>
@@ -155,11 +90,7 @@ exports[`renders MediaItemWidget unchanged with custom media renderer 1`] = `
 <div>
   <div
     class="memori-media-items"
-  >
-    <div
-      class="memori-media-items--grid"
-    />
-  </div>
+  />
 </div>
 `;
 
@@ -169,7 +100,7 @@ exports[`renders MediaItemWidget unchanged with img 1`] = `
     class="memori-media-items"
   >
     <div
-      class="memori-media-items--grid"
+      class="memori-media-items--grid memori-media-items--agent"
     >
       <div
         class="memori-media-item ease-out duration-500 delay-0 opacity-0 scale-95"
@@ -246,7 +177,7 @@ exports[`renders MediaItemWidget unchanged with img and sessionID 1`] = `
     class="memori-media-items"
   >
     <div
-      class="memori-media-items--grid"
+      class="memori-media-items--grid memori-media-items--agent"
     >
       <div
         class="memori-media-item ease-out duration-500 delay-0 opacity-0 scale-95"
@@ -321,11 +252,7 @@ exports[`renders MediaItemWidget unchanged with js snippet to exec 1`] = `
 <div>
   <div
     class="memori-media-items"
-  >
-    <div
-      class="memori-media-items--grid"
-    />
-  </div>
+  />
 </div>
 `;
 
@@ -334,9 +261,6 @@ exports[`renders MediaItemWidget unchanged with js snippet to show 1`] = `
   <div
     class="memori-media-items"
   >
-    <div
-      class="memori-media-items--grid"
-    />
     <div
       class="memori-media-item--snippet ease-out duration-500 opacity-0 translate-y-1"
     >
@@ -348,21 +272,10 @@ exports[`renders MediaItemWidget unchanged with js snippet to show 1`] = `
         >
           <pre
             aria-labelledby="#snippet-a669fadb-12c0-469b-9b6c-34db22d371ca"
-            style="color: rgb(197, 200, 198); text-shadow: 0 1px rgba(0, 0, 0, 0.3); font-family: Inconsolata, Monaco, Consolas, 'Courier New', Courier, monospace; direction: ltr; text-align: left; white-space: pre; word-spacing: normal; word-break: normal; line-height: 1.5; tab-size: 4; hyphens: none; padding: 1em; margin: .5em 0px; overflow: auto; border-radius: 0.3em; background: rgb(29, 31, 33);"
+            class="line-numbers"
           >
-            <code
-              style="color: rgb(197, 200, 198); text-shadow: 0 1px rgba(0, 0, 0, 0.3); font-family: Inconsolata, Monaco, Consolas, 'Courier New', Courier, monospace; direction: ltr; text-align: left; white-space: pre; word-spacing: normal; word-break: normal; line-height: 1.5; tab-size: 4; hyphens: none; float: left; padding-right: 10px;"
-            >
-              <span
-                class="react-syntax-highlighter-line-number"
-              >
-                1
-
-              </span>
-            </code>
             <code
               class="language-jsx"
-              style="color: rgb(197, 200, 198); text-shadow: 0 1px rgba(0, 0, 0, 0.3); font-family: Inconsolata, Monaco, Consolas, 'Courier New', Courier, monospace; direction: ltr; text-align: left; white-space: pre; word-spacing: normal; word-break: normal; line-height: 1.5; tab-size: 4; hyphens: none;"
             >
               console.log("Hello World!");
             </code>
@@ -376,13 +289,26 @@ exports[`renders MediaItemWidget unchanged with js snippet to show 1`] = `
             >
               <svg
                 aria-hidden="true"
+                fill="none"
                 focusable="false"
                 role="img"
-                viewBox="0 0 1024 1024"
+                stroke="currentColor"
+                stroke-linecap="round"
+                stroke-linejoin="round"
+                stroke-width="1.5"
+                viewBox="0 0 24 24"
                 xmlns="http://www.w3.org/2000/svg"
               >
+                <rect
+                  height="14"
+                  rx="2"
+                  ry="2"
+                  width="14"
+                  x="8"
+                  y="8"
+                />
                 <path
-                  d="M832 64H296c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8h496v688c0 4.4 3.6 8 8 8h56c4.4 0 8-3.6 8-8V96c0-17.7-14.3-32-32-32zM704 192H192c-17.7 0-32 14.3-32 32v530.7c0 8.5 3.4 16.6 9.4 22.6l173.3 173.3c2.2 2.2 4.7 4 7.4 5.5v1.9h4.2c3.5 1.3 7.2 2 11 2H704c17.7 0 32-14.3 32-32V224c0-17.7-14.3-32-32-32zM350 856.2L263.9 770H350v86.2zM664 888H414V746c0-22.1-17.9-40-40-40H232V264h432v624z"
+                  d="M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2"
                 />
               </svg>
             </span>
@@ -404,11 +330,7 @@ exports[`renders MediaItemWidget unchanged with no media 1`] = `
 <div>
   <div
     class="memori-media-items"
-  >
-    <div
-      class="memori-media-items--grid"
-    />
-  </div>
+  />
 </div>
 `;
 
@@ -418,184 +340,163 @@ exports[`renders MediaItemWidget unchanged with rgb color 1`] = `
     class="memori-media-items"
   >
     <div
-      class="memori-media-items--grid"
+      class="memori-media-items--grid memori-media-items--agent"
     >
       <div
         class="memori-media-item ease-out duration-500 delay-0 opacity-0 scale-95"
       >
-        <a
-          class="memori-media-item--link"
-          href="rgb(255, 0, 0)"
-          rel="noopener noreferrer"
-          target="_blank"
-          title="Rosso"
+        <div
+          class="memori-card memori-media-item--card memori-media-item--image memori-card--with-cover memori-card--hoverable"
         >
           <div
-            class="memori-card memori-media-item--card memori-media-item--image memori-card--with-cover memori-card--hoverable"
+            class="memori-spin"
           >
             <div
-              class="memori-spin"
+              class="memori-card--cover"
             >
-              <div
-                class="memori-card--cover"
-              >
-                <picture
-                  class="memori-media-item--figure"
-                >
-                  <div
-                    style="min-height: 150px; width: 100%; background-color: rgb(255, 0, 0);"
-                  />
-                  <figcaption
-                    class="memori-media-item--figure-caption"
-                  >
-                    Rosso
-                  </figcaption>
-                </picture>
-              </div>
-              <div
-                class="memori-card--content"
+              <picture
+                class="memori-media-item--figure"
               >
                 <div
-                  class="memori-card--children"
+                  class="memori-media-item--rgb-item"
+                  style="background-color: rgb(255, 0, 0);"
                 />
-              </div>
+                <figcaption
+                  class="memori-media-item--figure-caption"
+                >
+                  Rosso
+                </figcaption>
+              </picture>
+            </div>
+            <div
+              class="memori-card--content"
+            >
               <div
-                class="memori-spin--spinner"
+                class="memori-card--children"
+              />
+            </div>
+            <div
+              class="memori-spin--spinner"
+            >
+              <svg
+                aria-hidden="true"
+                class="memori-loading-icon"
+                focusable="false"
+                role="img"
+                viewBox="0 0 1024 1024"
+                xmlns="http://www.w3.org/2000/svg"
               >
-                <svg
-                  aria-hidden="true"
-                  class="memori-loading-icon"
-                  focusable="false"
-                  role="img"
-                  viewBox="0 0 1024 1024"
-                  xmlns="http://www.w3.org/2000/svg"
-                >
-                  <path
-                    d="M988 548c-19.9 0-36-16.1-36-36 0-59.4-11.6-117-34.6-171.3a440.45 440.45 0 00-94.3-139.9 437.71 437.71 0 00-139.9-94.3C629 83.6 571.4 72 512 72c-19.9 0-36-16.1-36-36s16.1-36 36-36c69.1 0 136.2 13.5 199.3 40.3C772.3 66 827 103 874 150c47 47 83.9 101.8 109.7 162.7 26.7 63.1 40.2 130.2 40.2 199.3.1 19.9-16 36-35.9 36z"
-                  />
-                </svg>
-              </div>
+                <path
+                  d="M988 548c-19.9 0-36-16.1-36-36 0-59.4-11.6-117-34.6-171.3a440.45 440.45 0 00-94.3-139.9 437.71 437.71 0 00-139.9-94.3C629 83.6 571.4 72 512 72c-19.9 0-36-16.1-36-36s16.1-36 36-36c69.1 0 136.2 13.5 199.3 40.3C772.3 66 827 103 874 150c47 47 83.9 101.8 109.7 162.7 26.7 63.1 40.2 130.2 40.2 199.3.1 19.9-16 36-35.9 36z"
+                />
+              </svg>
             </div>
           </div>
-        </a>
+        </div>
       </div>
       <div
         class="memori-media-item ease-out duration-500 delay-100 opacity-0 scale-95"
       >
-        <a
-          class="memori-media-item--link"
-          href="rgb(0, 255, 0)"
-          rel="noopener noreferrer"
-          target="_blank"
-          title="Verde"
+        <div
+          class="memori-card memori-media-item--card memori-media-item--image memori-card--with-cover memori-card--hoverable"
         >
           <div
-            class="memori-card memori-media-item--card memori-media-item--image memori-card--with-cover memori-card--hoverable"
+            class="memori-spin"
           >
             <div
-              class="memori-spin"
+              class="memori-card--cover"
             >
-              <div
-                class="memori-card--cover"
-              >
-                <picture
-                  class="memori-media-item--figure"
-                >
-                  <div
-                    style="min-height: 150px; width: 100%; background-color: rgb(0, 255, 0);"
-                  />
-                  <figcaption
-                    class="memori-media-item--figure-caption"
-                  >
-                    Verde
-                  </figcaption>
-                </picture>
-              </div>
-              <div
-                class="memori-card--content"
+              <picture
+                class="memori-media-item--figure"
               >
                 <div
-                  class="memori-card--children"
+                  class="memori-media-item--rgb-item"
+                  style="background-color: rgb(0, 255, 0);"
                 />
-              </div>
+                <figcaption
+                  class="memori-media-item--figure-caption"
+                >
+                  Verde
+                </figcaption>
+              </picture>
+            </div>
+            <div
+              class="memori-card--content"
+            >
               <div
-                class="memori-spin--spinner"
+                class="memori-card--children"
+              />
+            </div>
+            <div
+              class="memori-spin--spinner"
+            >
+              <svg
+                aria-hidden="true"
+                class="memori-loading-icon"
+                focusable="false"
+                role="img"
+                viewBox="0 0 1024 1024"
+                xmlns="http://www.w3.org/2000/svg"
               >
-                <svg
-                  aria-hidden="true"
-                  class="memori-loading-icon"
-                  focusable="false"
-                  role="img"
-                  viewBox="0 0 1024 1024"
-                  xmlns="http://www.w3.org/2000/svg"
-                >
-                  <path
-                    d="M988 548c-19.9 0-36-16.1-36-36 0-59.4-11.6-117-34.6-171.3a440.45 440.45 0 00-94.3-139.9 437.71 437.71 0 00-139.9-94.3C629 83.6 571.4 72 512 72c-19.9 0-36-16.1-36-36s16.1-36 36-36c69.1 0 136.2 13.5 199.3 40.3C772.3 66 827 103 874 150c47 47 83.9 101.8 109.7 162.7 26.7 63.1 40.2 130.2 40.2 199.3.1 19.9-16 36-35.9 36z"
-                  />
-                </svg>
-              </div>
+                <path
+                  d="M988 548c-19.9 0-36-16.1-36-36 0-59.4-11.6-117-34.6-171.3a440.45 440.45 0 00-94.3-139.9 437.71 437.71 0 00-139.9-94.3C629 83.6 571.4 72 512 72c-19.9 0-36-16.1-36-36s16.1-36 36-36c69.1 0 136.2 13.5 199.3 40.3C772.3 66 827 103 874 150c47 47 83.9 101.8 109.7 162.7 26.7 63.1 40.2 130.2 40.2 199.3.1 19.9-16 36-35.9 36z"
+                />
+              </svg>
             </div>
           </div>
-        </a>
+        </div>
       </div>
       <div
         class="memori-media-item ease-out duration-500 delay-200 opacity-0 scale-95"
       >
-        <a
-          class="memori-media-item--link"
-          href="rgb(0, 0, 255)"
-          rel="noopener noreferrer"
-          target="_blank"
-          title="Blu"
+        <div
+          class="memori-card memori-media-item--card memori-media-item--image memori-card--with-cover memori-card--hoverable"
         >
           <div
-            class="memori-card memori-media-item--card memori-media-item--image memori-card--with-cover memori-card--hoverable"
+            class="memori-spin"
           >
             <div
-              class="memori-spin"
+              class="memori-card--cover"
             >
-              <div
-                class="memori-card--cover"
-              >
-                <picture
-                  class="memori-media-item--figure"
-                >
-                  <div
-                    style="min-height: 150px; width: 100%; background-color: rgb(0, 0, 255);"
-                  />
-                  <figcaption
-                    class="memori-media-item--figure-caption"
-                  >
-                    Blu
-                  </figcaption>
-                </picture>
-              </div>
-              <div
-                class="memori-card--content"
+              <picture
+                class="memori-media-item--figure"
               >
                 <div
-                  class="memori-card--children"
+                  class="memori-media-item--rgb-item"
+                  style="background-color: rgb(0, 0, 255);"
                 />
-              </div>
+                <figcaption
+                  class="memori-media-item--figure-caption"
+                >
+                  Blu
+                </figcaption>
+              </picture>
+            </div>
+            <div
+              class="memori-card--content"
+            >
               <div
-                class="memori-spin--spinner"
+                class="memori-card--children"
+              />
+            </div>
+            <div
+              class="memori-spin--spinner"
+            >
+              <svg
+                aria-hidden="true"
+                class="memori-loading-icon"
+                focusable="false"
+                role="img"
+                viewBox="0 0 1024 1024"
+                xmlns="http://www.w3.org/2000/svg"
               >
-                <svg
-                  aria-hidden="true"
-                  class="memori-loading-icon"
-                  focusable="false"
-                  role="img"
-                  viewBox="0 0 1024 1024"
-                  xmlns="http://www.w3.org/2000/svg"
-                >
-                  <path
-                    d="M988 548c-19.9 0-36-16.1-36-36 0-59.4-11.6-117-34.6-171.3a440.45 440.45 0 00-94.3-139.9 437.71 437.71 0 00-139.9-94.3C629 83.6 571.4 72 512 72c-19.9 0-36-16.1-36-36s16.1-36 36-36c69.1 0 136.2 13.5 199.3 40.3C772.3 66 827 103 874 150c47 47 83.9 101.8 109.7 162.7 26.7 63.1 40.2 130.2 40.2 199.3.1 19.9-16 36-35.9 36z"
-                  />
-                </svg>
-              </div>
+                <path
+                  d="M988 548c-19.9 0-36-16.1-36-36 0-59.4-11.6-117-34.6-171.3a440.45 440.45 0 00-94.3-139.9 437.71 437.71 0 00-139.9-94.3C629 83.6 571.4 72 512 72c-19.9 0-36-16.1-36-36s16.1-36 36-36c69.1 0 136.2 13.5 199.3 40.3C772.3 66 827 103 874 150c47 47 83.9 101.8 109.7 162.7 26.7 63.1 40.2 130.2 40.2 199.3.1 19.9-16 36-35.9 36z"
+                />
+              </svg>
             </div>
           </div>
-        </a>
+        </div>
       </div>
     </div>
   </div>
@@ -608,7 +509,7 @@ exports[`renders MediaItemWidget with imgs in correct order (creation date) 1`]
     class="memori-media-items"
   >
     <div
-      class="memori-media-items--grid"
+      class="memori-media-items--grid memori-media-items--agent"
     >
       <div
         class="memori-media-item ease-out duration-500 delay-0 opacity-0 scale-95"

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

@@ -39,7 +39,7 @@ exports[`renders MediaWidget with links unchanged 1`] = `
       class="memori-link-items"
     >
       <div
-        class="memori-link-items--grid"
+        class="memori-link-items--grid memori-link-items--agent"
       >
         <div
           class="memori-link-item ease-out duration-500 delay-0 opacity-0 scale-95"
@@ -123,7 +123,7 @@ exports[`renders MediaWidget with media unchanged 1`] = `
       class="memori-media-items"
     >
       <div
-        class="memori-media-items--grid"
+        class="memori-media-items--grid memori-media-items--agent"
       >
         <div
           class="memori-media-item ease-out duration-500 delay-0 opacity-0 scale-95"