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

package/src/components/layouts/__snapshots__/ZoomedFullBody.test.tsx.snap

@@ -352,371 +352,378 @@ exports[`renders ZOOMED_FULL_BODY layout unchanged 1`] = `
         </div>
       </div>
       <div
-        class="memori--grid"
+        class="memori-fullpage-content-row"
       >
         <div
-          class="memori--grid-column memori--grid-column-left"
+          class="memori--grid"
         >
           <div
-            class="memori--avatar-wrapper memori--avatar-readyplayerme"
+            class="memori--grid-column memori--grid-column-left"
           >
             <div
-              class="memori--blob-container"
+              class="memori--avatar-wrapper memori--avatar-readyplayerme"
             >
               <div
-                class="memori-blob"
+                class="memori--blob-container"
               >
                 <div
-                  class="mainDiv"
-                />
-                <div
-                  class="mainDiv"
-                />
-                <div
-                  class="mainDiv"
-                />
-                <div
-                  class="mainDiv"
-                />
-                <div
-                  class="mainDiv"
-                />
-              </div>
-            </div>
-          </div>
-          <div
-            class="memori--avatar-toggle"
-          >
-            <button
-              aria-label="hide"
-              class="memori-button memori-button--ghost memori-button--md"
-              tabindex="0"
-              type="button"
-            >
-              <span
-                class="memori-button__icon"
-              >
-                <svg
-                  aria-hidden="true"
-                  class="lucide lucide-eye-off"
-                  fill="none"
-                  height="24"
-                  stroke="currentColor"
-                  stroke-linecap="round"
-                  stroke-linejoin="round"
-                  stroke-width="2"
-                  viewBox="0 0 24 24"
-                  width="24"
-                  xmlns="http://www.w3.org/2000/svg"
+                  class="memori-blob"
                 >
-                  <path
-                    d="M10.733 5.076a10.744 10.744 0 0 1 11.205 6.575 1 1 0 0 1 0 .696 10.747 10.747 0 0 1-1.444 2.49"
+                  <div
+                    class="mainDiv"
                   />
-                  <path
-                    d="M14.084 14.158a3 3 0 0 1-4.242-4.242"
+                  <div
+                    class="mainDiv"
                   />
-                  <path
-                    d="M17.479 17.499a10.75 10.75 0 0 1-15.417-5.151 1 1 0 0 1 0-.696 10.75 10.75 0 0 1 4.446-5.143"
+                  <div
+                    class="mainDiv"
                   />
-                  <path
-                    d="m2 2 20 20"
+                  <div
+                    class="mainDiv"
                   />
-                </svg>
-              </span>
-              <span
-                class="memori-button__content"
+                  <div
+                    class="mainDiv"
+                  />
+                </div>
+              </div>
+            </div>
+            <div
+              class="memori--avatar-toggle"
+            >
+              <button
+                aria-label="hide"
+                class="memori-button memori-button--ghost memori-button--md"
+                tabindex="0"
+                type="button"
               >
                 <span
-                  class="memori--avatar-toggle-text"
+                  class="memori-button__icon"
+                >
+                  <svg
+                    aria-hidden="true"
+                    class="lucide lucide-eye-off"
+                    fill="none"
+                    height="24"
+                    stroke="currentColor"
+                    stroke-linecap="round"
+                    stroke-linejoin="round"
+                    stroke-width="2"
+                    viewBox="0 0 24 24"
+                    width="24"
+                    xmlns="http://www.w3.org/2000/svg"
+                  >
+                    <path
+                      d="M10.733 5.076a10.744 10.744 0 0 1 11.205 6.575 1 1 0 0 1 0 .696 10.747 10.747 0 0 1-1.444 2.49"
+                    />
+                    <path
+                      d="M14.084 14.158a3 3 0 0 1-4.242-4.242"
+                    />
+                    <path
+                      d="M17.479 17.499a10.75 10.75 0 0 1-15.417-5.151 1 1 0 0 1 0-.696 10.75 10.75 0 0 1 4.446-5.143"
+                    />
+                    <path
+                      d="m2 2 20 20"
+                    />
+                  </svg>
+                </span>
+                <span
+                  class="memori-button__content"
                 >
-                  hide
+                  <span
+                    class="memori--avatar-toggle-text"
+                  >
+                    hide
+                  </span>
                 </span>
-              </span>
-            </button>
+              </button>
+            </div>
+            <div
+              id="extension"
+            />
           </div>
           <div
-            id="extension"
-          />
-        </div>
-        <div
-          class="memori-chat-layout--main "
-        >
-          <div
-            class="memori-chat-layout--controls "
+            class="memori-chat-layout--main"
           >
             <div
-              class="memori--start-panel"
+              class="memori-chat-layout--controls"
             >
               <div
-                class="memori--cover"
-              />
-              <div
-                class="memori--start-panel__body"
+                class="memori--start-panel"
               >
                 <div
-                  class="memori--title-container"
+                  class="memori--cover"
+                />
+                <div
+                  class="memori--start-panel__body"
                 >
-                  <picture
-                    class="memori--avatar"
-                  >
-                    <source
-                      src="https://aisuru.com/images/aisuru/square_logo.png"
-                    />
-                    <img
-                      alt="Memori"
-                      src="https://aisuru.com/images/aisuru/square_logo.png"
-                    />
-                  </picture>
                   <div
-                    class="memori--title-container__content"
+                    class="memori--title-container"
                   >
-                    <h2
-                      class="memori--title"
+                    <picture
+                      class="memori--avatar"
                     >
-                      Memori
-                    </h2>
+                      <source
+                        src="https://aisuru.com/images/aisuru/square_logo.png"
+                      />
+                      <img
+                        alt="Memori"
+                        src="https://aisuru.com/images/aisuru/square_logo.png"
+                      />
+                    </picture>
                     <div
-                      class="memori-expandable memori--description-text memori--description-text--collapsible"
+                      class="memori--title-container__content"
                     >
+                      <h2
+                        class="memori--title"
+                      >
+                        Memori
+                      </h2>
                       <div
-                        class="memori-expandable__inner"
-                        style="max-height: 9999px;"
+                        class="memori-expandable memori--description-text memori--description-text--collapsible"
                       >
-                        Lorem ipsum.
+                        <div
+                          class="memori-expandable__inner"
+                          style="max-height: 9999px;"
+                        >
+                          Lorem ipsum.
+                        </div>
                       </div>
                     </div>
-                  </div>
-                  <div
-                    class="memori--completion-provider-status--loading"
-                  >
                     <div
-                      class="memori-spin memori-spin--spinning"
+                      class="memori--completion-provider-status--loading"
                     >
                       <div
-                        aria-label="Loading"
-                        aria-live="polite"
-                        class="memori-spin__overlay"
-                        role="status"
+                        class="memori-spin memori-spin--spinning"
                       >
                         <div
-                          class="memori-spin__container"
+                          aria-label="Loading"
+                          aria-live="polite"
+                          class="memori-spin__overlay"
+                          role="status"
                         >
-                          <svg
-                            aria-hidden="true"
-                            class="lucide lucide-loader-circle memori-spin__icon"
-                            fill="none"
-                            height="24"
-                            stroke="currentColor"
-                            stroke-linecap="round"
-                            stroke-linejoin="round"
-                            stroke-width="2"
-                            viewBox="0 0 24 24"
-                            width="24"
-                            xmlns="http://www.w3.org/2000/svg"
+                          <div
+                            class="memori-spin__container"
                           >
-                            <path
-                              d="M21 12a9 9 0 1 1-6.219-8.56"
-                            />
-                          </svg>
+                            <svg
+                              aria-hidden="true"
+                              class="lucide lucide-loader-circle memori-spin__icon"
+                              fill="none"
+                              height="24"
+                              stroke="currentColor"
+                              stroke-linecap="round"
+                              stroke-linejoin="round"
+                              stroke-width="2"
+                              viewBox="0 0 24 24"
+                              width="24"
+                              xmlns="http://www.w3.org/2000/svg"
+                            >
+                              <path
+                                d="M21 12a9 9 0 1 1-6.219-8.56"
+                              />
+                            </svg>
+                          </div>
                         </div>
                       </div>
                     </div>
                   </div>
-                </div>
-                <div
-                  class="memori--description"
-                >
                   <div
-                    class="memori--language-row"
+                    class="memori--description"
                   >
                     <div
-                      class="memori-combobox memori-combobox--language-chooser memori--language-row__combobox"
+                      class="memori--language-row"
                     >
-                      <label
-                        class="memori-combobox__label"
-                        for=":ra:"
-                        id=":ra:-label"
-                      >
-                        write_and_speak.chatLanguageLabel
-                      </label>
-                      <button
-                        aria-expanded="false"
-                        aria-haspopup="dialog"
-                        aria-labelledby=":ra:-label"
-                        class="memori-combobox__trigger"
-                        id=":ra:"
-                        role="combobox"
-                        tabindex="0"
-                        type="button"
+                      <div
+                        class="memori-combobox memori-combobox--language-chooser memori--language-row__combobox"
                       >
-                        <span
-                          class="memori-combobox__value"
+                        <label
+                          class="memori-combobox__label"
+                          for=":ra:"
+                          id=":ra:-label"
                         >
-                          Italian
-                        </span>
-                        <span
-                          aria-hidden="true"
-                          class="memori-combobox__trigger-icon"
+                          write_and_speak.chatLanguageLabel
+                        </label>
+                        <button
+                          aria-expanded="false"
+                          aria-haspopup="dialog"
+                          aria-labelledby=":ra:-label"
+                          class="memori-combobox__trigger"
+                          id=":ra:"
+                          role="combobox"
+                          tabindex="0"
+                          type="button"
                         >
-                          <svg
-                            aria-hidden="true"
-                            class="lucide lucide-chevron-down"
-                            fill="none"
-                            height="16"
-                            stroke="currentColor"
-                            stroke-linecap="round"
-                            stroke-linejoin="round"
-                            stroke-width="2"
-                            viewBox="0 0 24 24"
-                            width="16"
-                            xmlns="http://www.w3.org/2000/svg"
+                          <span
+                            class="memori-combobox__value"
                           >
-                            <path
-                              d="m6 9 6 6 6-6"
-                            />
-                          </svg>
-                        </span>
-                      </button>
-                      <input
-                        aria-hidden="true"
-                        id="base-ui-:rb:"
-                        name="user-lang-pref"
-                        style="overflow: hidden; white-space: nowrap; position: fixed; top: 0px; left: 0px; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px;"
-                        tabindex="-1"
-                        value="IT"
-                      />
-                    </div>
-                  </div>
-                  <section
-                    class="memori--start-panel__mobile-info"
-                  >
-                    <div
-                      class="memori--start-panel__mobile-info-content"
-                    >
-                      <section
-                        class="memori--settings-section"
-                      >
-                        <div
-                          class="memori--settings-section__row"
-                        >
-                          <div
+                            Italian
+                          </span>
+                          <span
                             aria-hidden="true"
-                            class="memori--settings-section__icon-box memori--settings-section__icon-box--neutral"
+                            class="memori-combobox__trigger-icon"
                           >
                             <svg
-                              class="lucide lucide-eye memori--settings-section__icon"
+                              aria-hidden="true"
+                              class="lucide lucide-chevron-down"
                               fill="none"
-                              height="24"
+                              height="16"
                               stroke="currentColor"
                               stroke-linecap="round"
                               stroke-linejoin="round"
                               stroke-width="2"
                               viewBox="0 0 24 24"
-                              width="24"
+                              width="16"
                               xmlns="http://www.w3.org/2000/svg"
                             >
                               <path
-                                d="M2.062 12.348a1 1 0 0 1 0-.696 10.75 10.75 0 0 1 19.876 0 1 1 0 0 1 0 .696 10.75 10.75 0 0 1-19.876 0"
-                              />
-                              <circle
-                                cx="12"
-                                cy="12"
-                                r="3"
+                                d="m6 9 6 6 6-6"
                               />
                             </svg>
-                          </div>
+                          </span>
+                        </button>
+                        <input
+                          aria-hidden="true"
+                          id="base-ui-:rb:"
+                          name="user-lang-pref"
+                          style="overflow: hidden; white-space: nowrap; position: fixed; top: 0px; left: 0px; border: 0px; padding: 0px; width: 1px; height: 1px; margin: -1px;"
+                          tabindex="-1"
+                          value="IT"
+                        />
+                      </div>
+                    </div>
+                    <section
+                      class="memori--start-panel__mobile-info"
+                    >
+                      <div
+                        class="memori--start-panel__mobile-info-content"
+                      >
+                        <section
+                          class="memori--settings-section"
+                        >
                           <div
-                            class="memori--settings-section__content"
+                            class="memori--settings-section__row"
                           >
                             <div
-                              class="memori--settings-section__title-inline"
+                              aria-hidden="true"
+                              class="memori--settings-section__icon-box memori--settings-section__icon-box--neutral"
+                            >
+                              <svg
+                                class="lucide lucide-eye memori--settings-section__icon"
+                                fill="none"
+                                height="24"
+                                stroke="currentColor"
+                                stroke-linecap="round"
+                                stroke-linejoin="round"
+                                stroke-width="2"
+                                viewBox="0 0 24 24"
+                                width="24"
+                                xmlns="http://www.w3.org/2000/svg"
+                              >
+                                <path
+                                  d="M2.062 12.348a1 1 0 0 1 0-.696 10.75 10.75 0 0 1 19.876 0 1 1 0 0 1 0 .696 10.75 10.75 0 0 1-19.876 0"
+                                />
+                                <circle
+                                  cx="12"
+                                  cy="12"
+                                  r="3"
+                                />
+                              </svg>
+                            </div>
+                            <div
+                              class="memori--settings-section__content"
                             >
+                              <div
+                                class="memori--settings-section__title-inline"
+                              >
+                                <p
+                                  class="memori--settings-section__title"
+                                >
+                                  write_and_speak.pagePrivacyExplanation
+                                </p>
+                              </div>
                               <p
-                                class="memori--settings-section__title"
+                                class="memori--settings-section__description"
                               >
-                                write_and_speak.pagePrivacyExplanation
+                                write_and_speak.pagePrivacyExplanationList.authorUsesInfo
                               </p>
                             </div>
-                            <p
-                              class="memori--settings-section__description"
-                            >
-                              write_and_speak.pagePrivacyExplanationList.authorUsesInfo
-                            </p>
-                          </div>
-                          <span
-                            class="memori-tooltip"
-                          >
                             <span
-                              class="memori-tooltip__trigger"
-                              id="base-ui-:re:"
+                              class="memori-tooltip"
                             >
-                              <button
-                                aria-label="privacyPolicy"
-                                class="memori-button memori-button--toolbar memori-button--sm memori--privacy-popover-trigger memori--settings-section__info-trigger"
-                                tabindex="0"
-                                type="button"
+                              <span
+                                class="memori-tooltip__trigger"
+                                id="base-ui-:re:"
                               >
-                                <span
-                                  class="memori-button__content"
+                                <button
+                                  aria-label="privacyPolicy"
+                                  class="memori-button memori-button--toolbar memori-button--sm memori--privacy-popover-trigger memori--settings-section__info-trigger"
+                                  tabindex="0"
+                                  type="button"
                                 >
-                                  <svg
-                                    class="lucide lucide-info memori--settings-section__inline-info-icon"
-                                    fill="none"
-                                    height="24"
-                                    stroke="currentColor"
-                                    stroke-linecap="round"
-                                    stroke-linejoin="round"
-                                    stroke-width="2"
-                                    viewBox="0 0 24 24"
-                                    width="24"
-                                    xmlns="http://www.w3.org/2000/svg"
+                                  <span
+                                    class="memori-button__content"
                                   >
-                                    <circle
-                                      cx="12"
-                                      cy="12"
-                                      r="10"
-                                    />
-                                    <path
-                                      d="M12 16v-4"
-                                    />
-                                    <path
-                                      d="M12 8h.01"
-                                    />
-                                  </svg>
-                                </span>
-                              </button>
+                                    <svg
+                                      class="lucide lucide-info memori--settings-section__inline-info-icon"
+                                      fill="none"
+                                      height="24"
+                                      stroke="currentColor"
+                                      stroke-linecap="round"
+                                      stroke-linejoin="round"
+                                      stroke-width="2"
+                                      viewBox="0 0 24 24"
+                                      width="24"
+                                      xmlns="http://www.w3.org/2000/svg"
+                                    >
+                                      <circle
+                                        cx="12"
+                                        cy="12"
+                                        r="10"
+                                      />
+                                      <path
+                                        d="M12 16v-4"
+                                      />
+                                      <path
+                                        d="M12 8h.01"
+                                      />
+                                    </svg>
+                                  </span>
+                                </button>
+                              </span>
                             </span>
-                          </span>
-                        </div>
-                      </section>
-                    </div>
-                  </section>
-                  <div
-                    class="memori--start-actions"
-                  >
-                    <button
-                      class="memori-button memori-button--primary memori-button--lg memori--start-actions__start"
-                      style="font-weight: var(--memori-text-weight-bold);"
-                      tabindex="0"
-                      type="button"
+                          </div>
+                        </section>
+                      </div>
+                    </section>
+                    <div
+                      class="memori--start-actions"
                     >
-                      <span
-                        class="memori-button__content"
+                      <button
+                        class="memori-button memori-button--primary memori-button--lg memori--start-actions__start"
+                        style="font-weight: var(--memori-text-weight-bold);"
+                        tabindex="0"
+                        type="button"
                       >
-                        write_and_speak.tryMeButton
-                      </span>
-                    </button>
+                        <span
+                          class="memori-button__content"
+                        >
+                          write_and_speak.tryMeButton
+                        </span>
+                      </button>
+                    </div>
+                    <p
+                      class="memori--start-description"
+                    >
+                      write_and_speak.pageTryMeExplanation
+                    </p>
                   </div>
-                  <p
-                    class="memori--start-description"
-                  >
-                    write_and_speak.pageTryMeExplanation
-                  </p>
                 </div>
               </div>
             </div>
           </div>
         </div>
+        <div
+          class="memori--grid-column-artifact"
+        />
       </div>
     </div>
     <audio