@bcc-code/vue-bcc-chat-ui 5.7.7 → 6.1.0

package/package.json

@@ -2,7 +2,7 @@
   "name": "@bcc-code/vue-bcc-chat-ui",
   "author": "bcc-code",
   "license": "Apache-2.0",
-  "version": "5.7.7",
+  "version": "6.1.0",
   "type": "module",
   "private": false,
   "files": [
@@ -29,6 +29,7 @@
     "access": "public"
   },
   "peerDependencies": {
+    "@bcc-code/component-library-vue": "^0.6.0",
     "vue": "^3.0.0"
   },
   "devDependencies": {
@@ -47,10 +48,10 @@
     "typescript": "^5.8.2",
     "vite": "^6.2.0",
     "vite-plugin-dts": "^4.5.3",
-    "vue": "^3.5.13"
+    "vue": "^3.5.13",
+    "@bcc-code/component-library-vue": "^0.6.1"
   },
   "dependencies": {
-    "@bcc-code/design-library-vue": "^3.0.18",
     "@bcc-code/icons-vue": "^1.4.0",
     "@cometchat/chat-sdk-javascript": "4.0.12",
     "@cometchat/chat-uikit-vue": "4.3.24",
@@ -63,6 +64,7 @@
     "markdown-it": "^14.1.0",
     "panzoom": "^9.4.3"
   },
+  "packageManager": "pnpm@10.27.0+sha512.72d699da16b1179c14ba9e64dc71c9a40988cbdc65c264cb0e489db7de917f20dcf4d64d8723625f2969ba52d4b7e2a1170682d9ac2a5dcaeaab732b7e16f04a",
   "scripts": {
     "dev": "vite",
     "build": "npm run hotfix && vite build",

package/src/components/BccChatMessages.vue

@@ -1,17 +1,17 @@
 <script setup lang="ts">
-import chat from "../chat";
+import { BccMessage } from "@bcc-code/component-library-vue";
 import { Group } from "@cometchat/chat-sdk-javascript";
+import { localize } from "@cometchat/uikit-resources";
+import { MessageComposerConfiguration } from "@cometchat/uikit-shared";
 import { computed, inject, nextTick, onMounted, onUnmounted, Ref, ref, watch, watchEffect } from 'vue';
+import chat from "../chat";
+import { CometChatMessages } from "../chat/cometChatPatches";
+import { sendScheduledMessage } from "../chat/scheduledMessage";
 import { ChatInstance } from '../chat/types';
+import { getMessageComposerConfiguration, getMessageListConfiguration, getThreadedMessagesConfiguration } from "../chat/uiKit";
 import BccAttachmentBox from "./BccAttachmentBox.vue";
 import BccChatSendButton from "./BccChatSendButton.vue";
-import { getMessageComposerConfiguration, getMessageListConfiguration, getThreadedMessagesConfiguration } from "../chat/uiKit";
-import { CometChatMessages } from "../chat/cometChatPatches";
-import { MessageComposerConfiguration } from "@cometchat/uikit-shared";
-import { sendScheduledMessage } from "../chat/scheduledMessage";
 import BccScheduledMessageModal from "./BccScheduledMessageModal.vue";
-import { BccAlert } from "@bcc-code/design-library-vue";
-import { localize } from "@cometchat/uikit-resources";
 
 const props = defineProps({
     chatUid: { type: String, required: true },
@@ -204,9 +204,9 @@ function isParticipant(): boolean {
         </div>
         <BccScheduledMessageModal v-if="showModal" @close="closeModal()" @send="scheduleMessage" :closeOnOutsideClick="false">
         </BccScheduledMessageModal>
-        <BccAlert class="absolute top-0 w-[97%] mx-2 mt-1" icon closeButton context="danger" :open="showAlert"
-            @close="showAlert = false">
+        <BccMessage v-if="showAlert" class="absolute top-0 w-[97%] mx-2 mt-1" icon severity="error"
+            closable @close="showAlert = false">
             {{ localize("ERROR_SENDING_SCHEDULED_MESSAGE") }}
-        </BccAlert>
+        </BccMessage>
     </div>
 </template>

package/src/components/BccScheduledMessageModal.vue

@@ -1,5 +1,5 @@
 <script lang="ts" setup>
-import { BccButton, BccFormMessage, BccModal } from '@bcc-code/design-library-vue';
+import { BccButton, BccDialog, BccMessage } from '@bcc-code/component-library-vue';
 import { localize } from '@cometchat/uikit-resources';
 import { computed, onMounted, ref } from 'vue';
 
@@ -50,23 +50,21 @@ function scheduleMessage() {
 </script>
 
 <template>
-    <BccModal class="modal" :title="title" :open="true" @close="close()" :closeOnOutsideClick="closeOnOutsideClick"
-        :closeButton="true">
+    <BccDialog class="modal" :header="title" :visible="true" modal @hide="close()"
+        :dismissableMask="closeOnOutsideClick" :closable="true">
         <div class="flex flex-col w-full">
             <div class="flex w-full items-center justify-between">
                 <input class="bcc-input text-right justify-end" type="date" v-model="dateInput" required />
                 <p class="mx-2">{{ localize("AT") }}</p>
                 <input class="bcc-input text-right justify-end" type="time" v-model="timeInput" required />
             </div>
-            <BccFormMessage class="text-center mt-2 mb-0 text-red-500" v-if="!isDateInFuture" state="error">
+            <BccMessage class="mt-2" v-if="!isDateInFuture" severity="error">
                 {{ localize("ERROR_DATE_IN_FUTURE") }}
-            </BccFormMessage>
+            </BccMessage>
         </div>
 
-        <template #primaryAction>
-            <BccButton class="button" :disabled="messageSent" @click="scheduleMessage()">
-                {{ localize("SCHEDULE_MESSAGE") }}
-            </BccButton>
+        <template #footer>
+            <BccButton class="button" :label="localize('SCHEDULE_MESSAGE')" :disabled="messageSent" @click="scheduleMessage()" />
         </template>
-    </BccModal>
+    </BccDialog>
 </template>

package/src/components/BccScheduledMessages.vue

@@ -7,7 +7,7 @@ import { getScheduledMessagesComposerConfiguration, getScheduledMessagesListConf
 import { inject, nextTick, onMounted, onUnmounted, ref, Ref, watchEffect } from "vue";
 import { ChatInstance } from "../chat/types";
 import { localize } from "@cometchat/uikit-resources";
-import { BccAlert } from "@bcc-code/design-library-vue";
+import { BccMessage } from "@bcc-code/component-library-vue";
 import BccAttachmentBox from "./BccAttachmentBox.vue";
 const emit = defineEmits(['close']);
 
@@ -87,14 +87,14 @@ onUnmounted(() => {
                 <span v-if="chat.onlineStatus.value === 'offline'">Waiting for network...</span>
                 <span v-else>Connecting... </span>
             </div>
-            <BccAlert class="absolute top-0 w-[97%] mx-2 mt-11" icon closeButton context="danger"
-                :open="chatInstance!.showAlert" @close="chatInstance!.showAlert = false">
+            <BccMessage v-if="chatInstance!.showAlert" class="absolute top-0 w-[97%] mx-2 mt-11" icon severity="error"
+                closable @close="chatInstance!.showAlert = false">
                 {{ localize("ERROR_SENDING_SCHEDULED_MESSAGE") }}
-            </BccAlert>
-            <BccAlert class="absolute top-0 w-[97%] mx-2 mt-11" icon closeButton context="danger"
-                :open="chatInstance!.showRescheduleAlert" @close="chatInstance!.showRescheduleAlert = false">
+            </BccMessage>
+            <BccMessage v-if="chatInstance!.showRescheduleAlert" class="absolute top-0 w-[97%] mx-2 mt-11" icon severity="error"
+                closable @close="chatInstance!.showRescheduleAlert = false">
                 {{ localize("ERROR_RESCHEDULING_MESSAGE") }}
-            </BccAlert>
+            </BccMessage>
         </div>
     </div>
 </template>