vue-parley 4.9.1 → 5.0.0

package/README.md

@@ -244,7 +244,7 @@ Every component and directive the chat uses is imported by the component itself,
 | `ChatPage` | The whole chat: contact list, conversation and call view. |
 | `Call` | The call view (async). |
 | `ChatList`, `ChatConversation`, `ChatHeader`, `ChatMessages`, `ChatInput`, `ChatBubble` | Building blocks for custom layouts. |
-| `BIcon`, `BEmojiPicker`, `BVirtualVerticalList` | A Phosphor icon by name, the emoji picker and the virtualised list the chat uses. Every other control is a PrimeVue component. |
+| `BIcon`, `BEmojiPicker`, `BVirtualVerticalList` | A Phosphor icon by name (rendered by `@iconify/vue` from bundled `ph` data, so it never calls the Iconify API), the emoji picker (PrimeVue and Tailwind; its `select` event carries an `EmojiSelection`, `{ emoji, label }`) and the virtualised list the chat uses. Every other control is a PrimeVue component. |
 | `useChatStore`, `useMessagesStore`, `useMediaStore`, `useProfileStore`, `useCallStore` | The Pinia stores. |
 | `messageMedia(message)` | A message's photo and video album: its `media`, or its `imageUrl` as photos. |
 | `resetChat()` | Forgets everything the chat loaded for the signed-in user (conversations, threads, drafts, shared media, the downloaded-file cache) and ends a running call. Call it on sign-out or an account switch, before the next user's chat mounts; the handlers stay. Each store also has its own `reset()` (`clearCache()` on the media store). |
@@ -333,6 +333,8 @@ app/
   types/          handler interfaces and data types
   assets/css/     theme tokens and base styles
 i18n/locales/     en and fa translations
+scripts/          generate-icons.mjs: BIcon's Phosphor icons from @iconify-json/ph, one module per weight (add an icon there)
+                  generate-emoji.mjs: BEmojiPicker's emoji list from emojibase-data (rerun after bumping it)
 fakes/            in-memory backend and call handlers (published as `vue-parley/fakes`)
 demo/             demo app (workspace package)
 e2e/              Playwright tests and harness

package/dist/chat.css

@@ -709,6 +709,10 @@
     margin-inline-start: var(--spacing);
   }
 
+  :where(.vue-chat, .vue-chat *).ms-1\.5 {
+    margin-inline-start: calc(var(--spacing) * 1.5);
+  }
+
   :where(.vue-chat, .vue-chat *).ms-px {
     margin-inline-start: 1px;
   }
@@ -745,6 +749,10 @@
     margin-bottom: calc(var(--spacing) * .5);
   }
 
+  :where(.vue-chat, .vue-chat *).mb-1 {
+    margin-bottom: var(--spacing);
+  }
+
   :where(.vue-chat, .vue-chat *).mb-1\.5 {
     margin-bottom: calc(var(--spacing) * 1.5);
   }
@@ -800,6 +808,10 @@
     display: inline-flex;
   }
 
+  :where(.vue-chat, .vue-chat *).table {
+    display: table;
+  }
+
   :where(.vue-chat, .vue-chat *).aspect-square {
     aspect-ratio: 1;
   }
@@ -863,11 +875,21 @@
     height: calc(var(--spacing) * 7);
   }
 
+  :where(.vue-chat, .vue-chat *).size-7\! {
+    width: calc(var(--spacing) * 7) !important;
+    height: calc(var(--spacing) * 7) !important;
+  }
+
   :where(.vue-chat, .vue-chat *).size-8 {
     width: calc(var(--spacing) * 8);
     height: calc(var(--spacing) * 8);
   }
 
+  :where(.vue-chat, .vue-chat *).size-8\! {
+    width: calc(var(--spacing) * 8) !important;
+    height: calc(var(--spacing) * 8) !important;
+  }
+
   :where(.vue-chat, .vue-chat *).size-9 {
     width: calc(var(--spacing) * 9);
     height: calc(var(--spacing) * 9);
@@ -1025,6 +1047,10 @@
     height: calc(var(--spacing) * 57.5);
   }
 
+  :where(.vue-chat, .vue-chat *).h-60 {
+    height: calc(var(--spacing) * 60);
+  }
+
   :where(.vue-chat, .vue-chat *).h-60\.5 {
     height: calc(var(--spacing) * 60.5);
   }
@@ -1033,6 +1059,10 @@
     height: calc(var(--spacing) * 72);
   }
 
+  :where(.vue-chat, .vue-chat *).h-\[407px\] {
+    height: 407px;
+  }
+
   :where(.vue-chat, .vue-chat *).h-dvh {
     height: 100dvh;
   }
@@ -1213,6 +1243,10 @@
     width: calc(var(--spacing) * 85);
   }
 
+  :where(.vue-chat, .vue-chat *).w-\[332px\] {
+    width: 332px;
+  }
+
   :where(.vue-chat, .vue-chat *).w-auto {
     width: auto;
   }
@@ -1277,6 +1311,10 @@
     min-width: 0;
   }
 
+  :where(.vue-chat, .vue-chat *).min-w-0\! {
+    min-width: 0 !important;
+  }
+
   :where(.vue-chat, .vue-chat *).min-w-12 {
     min-width: calc(var(--spacing) * 12);
   }
@@ -1309,6 +1347,10 @@
     flex-shrink: 0;
   }
 
+  :where(.vue-chat, .vue-chat *).grow {
+    flex-grow: 1;
+  }
+
   :where(.vue-chat, .vue-chat *).grow-0\! {
     flex-grow: 0 !important;
   }
@@ -1462,6 +1504,10 @@
     grid-template-columns: repeat(3, minmax(0, 1fr));
   }
 
+  :where(.vue-chat, .vue-chat *).grid-cols-8 {
+    grid-template-columns: repeat(8, minmax(0, 1fr));
+  }
+
   :where(.vue-chat, .vue-chat *).flex-col {
     flex-direction: column;
   }
@@ -1542,6 +1588,10 @@
     column-gap: 0;
   }
 
+  :where(.vue-chat, .vue-chat *).gap-x-0\.5 {
+    column-gap: calc(var(--spacing) * .5);
+  }
+
   :where(.vue-chat, .vue-chat *).gap-x-1 {
     column-gap: var(--spacing);
   }
@@ -1644,6 +1694,10 @@
     border-color: var(--color-chat-outline-variant);
   }
 
+  :where(.vue-chat, .vue-chat *).justify-self-center {
+    justify-self: center;
+  }
+
   :where(.vue-chat, .vue-chat *).truncate {
     text-overflow: ellipsis;
     white-space: nowrap;
@@ -1670,6 +1724,10 @@
     overflow-y: auto !important;
   }
 
+  :where(.vue-chat, .vue-chat *).overscroll-contain {
+    overscroll-behavior: contain;
+  }
+
   :where(.vue-chat, .vue-chat *).\!rounded {
     border-radius: .25rem !important;
   }
@@ -1702,6 +1760,10 @@
     border-radius: var(--radius-lg);
   }
 
+  :where(.vue-chat, .vue-chat *).rounded-lg\! {
+    border-radius: var(--radius-lg) !important;
+  }
+
   :where(.vue-chat, .vue-chat *).rounded-md {
     border-radius: var(--radius-md);
   }
@@ -1909,6 +1971,16 @@
     }
   }
 
+  :where(.vue-chat, .vue-chat *).bg-black\/55\! {
+    background-color: #0000008c !important;
+  }
+
+  @supports (color: color-mix(in lab, red, red)) {
+    :where(.vue-chat, .vue-chat *).bg-black\/55\! {
+      background-color: color-mix(in oklab, var(--color-black) 55%, transparent) !important;
+    }
+  }
+
   :where(.vue-chat, .vue-chat *).bg-black\/95\! {
     background-color: #000000f2 !important;
   }
@@ -2344,10 +2416,6 @@
     fill: var(--color-chat-surface-3);
   }
 
-  :where(.vue-chat, .vue-chat *).fill-current {
-    fill: currentColor;
-  }
-
   :where(.vue-chat, .vue-chat *).fill-error {
     fill: var(--color-error);
   }
@@ -2444,6 +2512,10 @@
     padding: calc(var(--spacing) * 4);
   }
 
+  :where(.vue-chat, .vue-chat *).p-6 {
+    padding: calc(var(--spacing) * 6);
+  }
+
   :where(.vue-chat, .vue-chat *).px-1 {
     padding-inline: var(--spacing);
   }
@@ -2572,6 +2644,10 @@
     padding-inline-end: calc(var(--spacing) * 1.5);
   }
 
+  :where(.vue-chat, .vue-chat *).pe-9\! {
+    padding-inline-end: calc(var(--spacing) * 9) !important;
+  }
+
   :where(.vue-chat, .vue-chat *).pe-11\! {
     padding-inline-end: calc(var(--spacing) * 11) !important;
   }
@@ -2588,6 +2664,10 @@
     padding-top: var(--spacing);
   }
 
+  :where(.vue-chat, .vue-chat *).pt-2 {
+    padding-top: calc(var(--spacing) * 2);
+  }
+
   :where(.vue-chat, .vue-chat *).pt-2\.5 {
     padding-top: calc(var(--spacing) * 2.5);
   }
@@ -2628,6 +2708,10 @@
     padding-bottom: var(--spacing);
   }
 
+  :where(.vue-chat, .vue-chat *).pb-1\.5 {
+    padding-bottom: calc(var(--spacing) * 1.5);
+  }
+
   :where(.vue-chat, .vue-chat *).pb-2 {
     padding-bottom: calc(var(--spacing) * 2);
   }
@@ -2724,6 +2808,10 @@
     line-height: var(--tw-leading, var(--text-xl--line-height));
   }
 
+  :where(.vue-chat, .vue-chat *).text-\[1\.6rem\]\! {
+    font-size: 1.6rem !important;
+  }
+
   :where(.vue-chat, .vue-chat *).text-\[7px\] {
     font-size: 7px;
   }
@@ -2765,6 +2853,11 @@
     line-height: 1;
   }
 
+  :where(.vue-chat, .vue-chat *).leading-none\! {
+    --tw-leading: 1 !important;
+    line-height: 1 !important;
+  }
+
   :where(.vue-chat, .vue-chat *).leading-normal\! {
     --tw-leading: var(--leading-normal) !important;
     line-height: var(--leading-normal) !important;
@@ -2945,6 +3038,14 @@
     }
   }
 
+  :where(.vue-chat, .vue-chat *).capitalize {
+    text-transform: capitalize;
+  }
+
+  :where(.vue-chat, .vue-chat *).lowercase {
+    text-transform: lowercase;
+  }
+
   :where(.vue-chat, .vue-chat *).uppercase {
     text-transform: uppercase;
   }
@@ -2982,6 +3083,11 @@
     opacity: 1 !important;
   }
 
+  :where(.vue-chat, .vue-chat *).shadow {
+    --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, #0000001a), 0 1px 2px -1px var(--tw-shadow-color, #0000001a);
+    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
+  }
+
   :where(.vue-chat, .vue-chat *).shadow-2xl {
     --tw-shadow: 0 25px 50px -12px var(--tw-shadow-color, #00000040);
     box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
@@ -3267,13 +3373,13 @@
   }
 
   @media (hover: hover) {
-    :where(.vue-chat, .vue-chat *).hover\:bg-black\/70:hover {
-      background-color: #000000b3;
+    :where(.vue-chat, .vue-chat *).hover\:bg-black\/70\!:hover {
+      background-color: #000000b3 !important;
     }
 
     @supports (color: color-mix(in lab, red, red)) {
-      :where(.vue-chat, .vue-chat *).hover\:bg-black\/70:hover {
-        background-color: color-mix(in oklab, var(--color-black) 70%, transparent);
+      :where(.vue-chat, .vue-chat *).hover\:bg-black\/70\!:hover {
+        background-color: color-mix(in oklab, var(--color-black) 70%, transparent) !important;
       }
     }
 
@@ -4283,11 +4389,3 @@
     transform: scaleY(-1) translateY(0);
 }
 }
-
-:where(.vue-chat, .vue-chat *).v3-emoji-picker {
-  height: 407px;
-  width: 332px;
-}
-:where(.vue-chat, .vue-chat *).v3-emoji-picker .v3-footer {
-  display: none !important;
-}

package/dist/chunks/{Call-DYRrJJ-j.mjs → Call-CVmsm2_5.mjs}

@@ -1,5 +1,5 @@
 import { ref, onMounted, onUnmounted, watch, nextTick, reactive, onBeforeUnmount, defineComponent, openBlock, createElementBlock, createBlock, unref, mergeProps, withCtx, createVNode, normalizeClass, computed, Fragment, normalizeStyle, createElementVNode, toDisplayString, withModifiers, createCommentVNode, withDirectives, vShow, renderList } from "vue";
-import { u as useCallStore, a as useLocalI18n, c as chat, b as useDirection, d as useChatStore, f as formatDuration } from "./index-CQOh6W_w.mjs";
+import { u as useCallStore, a as useLocalI18n, c as chat, b as useDirection, d as useChatStore, f as formatDuration } from "./index-zMhlsdTO.mjs";
 import { useEventListener, useWindowSize, useDraggable } from "@vueuse/core";
 import Avatar from "primevue/avatar";
 import Button from "primevue/button";
@@ -1152,4 +1152,4 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
 export {
   _sfc_main as default
 };
-//# sourceMappingURL=Call-DYRrJJ-j.mjs.map
+//# sourceMappingURL=Call-CVmsm2_5.mjs.map