From 54eb389c579ed641dc453ba2297b48b9fddfbd20 Mon Sep 17 00:00:00 2001
From: Paul Valerie GOMA <paulgoma07@gmail.com>
Date: Thu, 24 Jul 2025 00:14:16 +0200
Subject: [PATCH 01/13] =?UTF-8?q?=F0=9F=8F=B7=EF=B8=8F=20=20Message=20comp?=
 =?UTF-8?q?onent=20interface=20file=20added?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/message/IVMessage.type.ts | 32 ++++++++++++++++++++++++
 1 file changed, 32 insertions(+)
 create mode 100644 src/components/message/IVMessage.type.ts

diff --git a/src/components/message/IVMessage.type.ts b/src/components/message/IVMessage.type.ts
new file mode 100644
index 0000000..d58e2ce
--- /dev/null
+++ b/src/components/message/IVMessage.type.ts
@@ -0,0 +1,32 @@
+/**
+ * Interface representing the structure of a message notice component.
+ */
+export default interface INotice {
+  /**
+   * The title or main text of the notice.
+   */
+  title: string;
+
+  /**
+   * Determines whether an icon should be displayed alongside the notice.
+   * @default false
+   */
+  icon?: boolean;
+
+  /**
+   * The type of notice, which affects its visual style and semantics.
+   * - `info`: Informational message
+   * - `warning`: Warning message
+   * - `alert`: Error or critical alert
+   * - `success`: Confirmation or success message
+   * - `active`: Ongoing or active status
+   * - undefined: No specific type
+   */
+  type?: 'info' | 'warning' | 'alert' | 'success' | 'active' | undefined;
+
+  /**
+   * If true, the notice can be closed by the user.
+   * @default false
+   */
+  closable?: boolean;
+}

From 1aa7a142c6cc49f040cf9745fa666d6411e01d0a Mon Sep 17 00:00:00 2001
From: Paul Valerie GOMA <paulgoma07@gmail.com>
Date: Thu, 24 Jul 2025 00:15:57 +0200
Subject: [PATCH 02/13] =?UTF-8?q?=F0=9F=8F=B7=EF=B8=8F=20=20Message=20comp?=
 =?UTF-8?q?onent=20interface=20file=20updated?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/message/IVMessage.type.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/message/IVMessage.type.ts b/src/components/message/IVMessage.type.ts
index d58e2ce..28a74db 100644
--- a/src/components/message/IVMessage.type.ts
+++ b/src/components/message/IVMessage.type.ts
@@ -1,7 +1,7 @@
 /**
  * Interface representing the structure of a message notice component.
  */
-export default interface INotice {
+export default interface IVMessage {
   /**
    * The title or main text of the notice.
    */

From 8a43684027db51e3982dd7059d5f854d1b7cd75f Mon Sep 17 00:00:00 2001
From: Paul Valerie GOMA <paulgoma07@gmail.com>
Date: Thu, 24 Jul 2025 00:41:30 +0200
Subject: [PATCH 03/13] =?UTF-8?q?=F0=9F=8F=B7=EF=B8=8F=20=20Message=20comp?=
 =?UTF-8?q?onent=20interface=20file=20updated?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/message/IVMessage.type.ts | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/src/components/message/IVMessage.type.ts b/src/components/message/IVMessage.type.ts
index 28a74db..47a6a15 100644
--- a/src/components/message/IVMessage.type.ts
+++ b/src/components/message/IVMessage.type.ts
@@ -19,10 +19,9 @@ export default interface IVMessage {
    * - `warning`: Warning message
    * - `alert`: Error or critical alert
    * - `success`: Confirmation or success message
-   * - `active`: Ongoing or active status
    * - undefined: No specific type
    */
-  type?: 'info' | 'warning' | 'alert' | 'success' | 'active' | undefined;
+  type?: 'info' | 'warning' | 'alert' | 'success' | undefined;
 
   /**
    * If true, the notice can be closed by the user.

From 574d2da0256ca4010fde8b5440f328fec63a5600 Mon Sep 17 00:00:00 2001
From: Paul Valerie GOMA <paulgoma07@gmail.com>
Date: Thu, 24 Jul 2025 02:32:35 +0200
Subject: [PATCH 04/13] =?UTF-8?q?=F0=9F=90=9B=20fix:=20bug=20fixed?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/badge/VBadge.vue | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/src/components/badge/VBadge.vue b/src/components/badge/VBadge.vue
index e474e5d..49c2c7b 100644
--- a/src/components/badge/VBadge.vue
+++ b/src/components/badge/VBadge.vue
@@ -23,11 +23,11 @@ const severity = computed(() => {
 
 const icon = computed(() => {
   switch (props.type) {
-    case 'error': return 'ri-close-circle-line';
-    case 'warning' : return 'ri-alert-line';
-    case 'success' : return 'ri-checkbox-circle-line';
-    case 'info': return 'ri-information-line';
-    case 'new': return 'ri-flashlight-line';
+    case 'error': return 'ri-spam-fill';
+    case 'warning' : return 'ri-alert-fill';
+    case 'success' : return 'ri-checkbox-circle-fill';
+    case 'info': return 'ri-information-fill';
+    case 'new': return 'ri-flashlight-fill';
     default:
       return undefined;
     }
@@ -45,7 +45,7 @@ const limit = computed(() => props.maxWidth);
     class="p-tag"
     :class="{'small': props.small}"
   >
-    <i v-if="!props.noIcon || props.type === undefined" :class="icon"></i>
+    <i v-if="!props.noIcon || props.type === undefined" :class="icon" style="font-weight: 100;"></i>
     <span :class="{'limit': props.maxWidth}">{{ props.label }}</span>
   </Tag>
 </template>

From 55c47947e40657d5bbe2819c784461a01f71d962 Mon Sep 17 00:00:00 2001
From: Paul Valerie GOMA <paulgoma07@gmail.com>
Date: Thu, 24 Jul 2025 02:33:52 +0200
Subject: [PATCH 05/13] Message component added

---
 src/components/message/VMessage.vue | 116 ++++++++++++++++++++++++++++
 1 file changed, 116 insertions(+)
 create mode 100644 src/components/message/VMessage.vue

diff --git a/src/components/message/VMessage.vue b/src/components/message/VMessage.vue
new file mode 100644
index 0000000..8aaca75
--- /dev/null
+++ b/src/components/message/VMessage.vue
@@ -0,0 +1,116 @@
+<script setup lang="ts">
+import type IVMessage from './IVMessage.type';
+import Message from 'primevue/message';
+import VButton from '../button/VButton.vue';
+import { computed } from 'vue';
+import styles from '@visua/typography.module.css';
+
+const props = withDefaults(defineProps<IVMessage>(), {
+  icon: true,
+  type: undefined,
+  closable: false,
+})
+
+const emit = defineEmits(['close']);
+
+const iconClass = computed(() => {
+  switch (props.type) {
+    case 'alert': return 'ri-spam-fill';
+    case 'warning' : return 'ri-alert-fill';
+    case 'success' : return 'ri-checkbox-circle-fill';
+    case 'info': return 'ri-information-fill';
+    default:
+      return undefined;
+}
+});
+
+const severity = computed(() => {
+  switch (props.type) {
+    case 'alert': return 'error';
+    case 'warning' : return 'warn';
+    case 'success' : return 'success';
+    case 'info' : return 'info';
+    default:
+      return undefined;
+  }
+});
+
+const iconColor = computed(() => {
+  switch (props.type) {
+    case 'alert': return 'var(--text-default-error)';
+    case 'warning' : return 'var(--text-default-warning)';
+    case 'success' : return 'var(--text-default-success)';
+    case 'info': return 'var(--text-default-info)';
+    default:
+      return 'var(--text-mention-grey)';
+  }
+});
+</script>
+
+<template>
+  <Message
+    role="alert"
+    :closable="props.closable"
+    :severity="severity"
+    size="large"
+    class="p-message"
+    @close="emit('close', $event)"
+  >
+    <template #container="slotProps">
+      <div class="container">
+        <div class="header">
+          <i :class="[iconClass]" :style="{color: iconColor}" style="font-size: var(--p-message-icon-lg-size);"></i>
+          <span class="title" :class="[styles['text-body-MD-standard-text-Regular']]" :style="{color: iconColor}">
+            {{ props.title }}
+          </span>
+          <VButton
+          v-if="props.closable"
+            title="Fermer le message"
+            tertiary
+            no-outline
+            size="sm"
+            icon-only
+            aria-label="Fermer"
+            icon="ri-close-line"
+            type="button"
+            @click="slotProps.closeCallback"
+          />
+        </div>
+        <div v-if="$slots.content" class="content">
+          <slot name="content"/>
+        </div>
+      </div>
+    </template>
+  </Message>
+</template>
+
+<style lang="css" scoped>
+.p-message{
+  width: 100%;
+  height: fit-content;
+  margin: 0px;
+}
+
+.container{
+  padding: 0.5rem 0.75rem;
+  display: flex;
+  flex-direction: column;
+  gap: var(--p-message-content-gap);
+}
+
+.header{
+  display: flex;
+  flex-direction: row;
+  gap: var(--p-message-content-gap);
+  align-items: baseline;
+}
+
+.title{
+  width: 100%;
+}
+
+.content{
+  display: block;
+  padding: 0rem 0.825rem 0.5rem 0.825rem;
+}
+</style>

From a4c47617d88029077fe689e3f0943a4eef1b2143 Mon Sep 17 00:00:00 2001
From: Paul Valerie GOMA <paulgoma07@gmail.com>
Date: Thu, 24 Jul 2025 02:34:32 +0200
Subject: [PATCH 06/13] Display some message components

---
 src/App.vue | 20 +++++++++++---------
 1 file changed, 11 insertions(+), 9 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index 9c3f67f..61efa4d 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -5,20 +5,22 @@
 // import VAccordionView from '../template/VAccordionView.vue';
 // import VInputView from '../template/VInputView.vue';
 // import VCheckboxView from '../template/VCheckboxView.vue';
-// import VBadgeView from '../template/VBadgeView.vue';
-// import VSelectView from '../template/VSelectView.vue';
-import VProgressBarView from '../template/VProgressBarView.vue';
+import VBadgeView from '../template/VBadgeView.vue';
+import VSelectView from '../template/VSelectView.vue';
+// import VProgressBarView from '../template/VProgressBarView.vue';
+import VMessageView from '../template/VMessageView.vue';
 </script>
 
 
 <template>
   <!-- <VButtonView/> -->
   <!-- <VButtonGroupView/> -->
-   <!-- <VLinkView/> -->
-    <!-- <VAccordionView/> -->
+  <!-- <VLinkView/> -->
+  <!-- <VAccordionView/> -->
   <!-- <VInputView/> -->
-   <!-- <VCheckboxView/> -->
-    <!-- <VBadgeView/> -->
-     <!-- <VSelectView/> -->
-      <VProgressBarView/>
+  <!-- <VCheckboxView/> -->
+  <VBadgeView/>
+  <VSelectView/>
+  <!-- <VProgressBarView/> -->
+  <VMessageView/>
 </template>

From 4b50cef7fbcc9d4982101d6d5b9a207643e5eec5 Mon Sep 17 00:00:00 2001
From: Paul Valerie GOMA <paulgoma07@gmail.com>
Date: Thu, 24 Jul 2025 02:43:39 +0200
Subject: [PATCH 07/13] =?UTF-8?q?=E2=99=BB=EF=B8=8F=20=20refactor:=20Messa?=
 =?UTF-8?q?ge=20component=20Updated?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/message/VMessage.vue | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/components/message/VMessage.vue b/src/components/message/VMessage.vue
index 8aaca75..b834126 100644
--- a/src/components/message/VMessage.vue
+++ b/src/components/message/VMessage.vue
@@ -6,7 +6,6 @@ import { computed } from 'vue';
 import styles from '@visua/typography.module.css';
 
 const props = withDefaults(defineProps<IVMessage>(), {
-  icon: true,
   type: undefined,
   closable: false,
 })

From e05b10a34b2888e46e58981e595c11a965b8d7db Mon Sep 17 00:00:00 2001
From: Paul Valerie GOMA <paulgoma07@gmail.com>
Date: Thu, 24 Jul 2025 02:44:51 +0200
Subject: [PATCH 08/13] =?UTF-8?q?=F0=9F=8F=B7=EF=B8=8F=20=20Message=20comp?=
 =?UTF-8?q?onent=20interface=20file=20updated?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/message/IVMessage.type.ts | 6 ------
 1 file changed, 6 deletions(-)

diff --git a/src/components/message/IVMessage.type.ts b/src/components/message/IVMessage.type.ts
index 47a6a15..9d03036 100644
--- a/src/components/message/IVMessage.type.ts
+++ b/src/components/message/IVMessage.type.ts
@@ -7,12 +7,6 @@ export default interface IVMessage {
    */
   title: string;
 
-  /**
-   * Determines whether an icon should be displayed alongside the notice.
-   * @default false
-   */
-  icon?: boolean;
-
   /**
    * The type of notice, which affects its visual style and semantics.
    * - `info`: Informational message

From 83f9097970b78695d8b56e3f4d88c258cfd092bb Mon Sep 17 00:00:00 2001
From: Paul Valerie GOMA <paulgoma07@gmail.com>
Date: Thu, 24 Jul 2025 02:45:57 +0200
Subject: [PATCH 09/13] =?UTF-8?q?=E2=9C=85=20test:=20added=20test=20file?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 test/VMessage.spec.ts | 37 +++++++++++++++++++++++++++++++++++++
 1 file changed, 37 insertions(+)
 create mode 100644 test/VMessage.spec.ts

diff --git a/test/VMessage.spec.ts b/test/VMessage.spec.ts
new file mode 100644
index 0000000..5804f37
--- /dev/null
+++ b/test/VMessage.spec.ts
@@ -0,0 +1,37 @@
+import { describe, it, expect } from 'vitest'
+import { mount } from '@vue/test-utils'
+import VMessage from '../src/components/message/VMessage.vue'
+
+describe('VMessage.vue', () => {
+  it('renders the title', () => {
+    const wrapper = mount(VMessage, {
+      props: { title: 'Test Message' }
+    })
+    expect(wrapper.text()).toContain('Test Message')
+  })
+
+  it('shows the correct icon class for type "alert"', () => {
+    const wrapper = mount(VMessage, {
+      props: { title: 'Alert Message', type: 'alert' }
+    })
+    const icon = wrapper.find('i')
+    expect(icon.classes()).toContain('ri-spam-fill')
+  })
+
+  it('shows the close button if closable is true', () => {
+    const wrapper = mount(VMessage, {
+      props: { title: 'Closable Message', closable: true }
+    })
+    const button = wrapper.find('button[aria-label="Fermer"]')
+    expect(button.exists()).toBe(true)
+  })
+
+  it('emits close event when close button is clicked', async () => {
+    const wrapper = mount(VMessage, {
+      props: { title: 'Closable Message', closable: true }
+    })
+    const button = wrapper.find('button[aria-label="Fermer"]')
+    await button.trigger('click')
+    expect(wrapper.emitted()).toHaveProperty('close')
+  })
+})

From b034c1a58748cf8fdb61eb857fdb003fa2b3d114 Mon Sep 17 00:00:00 2001
From: Paul Valerie GOMA <paulgoma07@gmail.com>
Date: Thu, 24 Jul 2025 02:47:32 +0200
Subject: [PATCH 10/13] 1.0.8 -> 1.0.9

---
 package-lock.json | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index f5dab22..2cc8904 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "@cellule-financiere-pmo/visua-vue",
-  "version": "1.0.8",
+  "version": "1.0.9",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "@cellule-financiere-pmo/visua-vue",
-      "version": "1.0.8",
+      "version": "1.0.9",
       "license": "ISC",
       "dependencies": {
         "@cellule-financiere-pmo/visua": "1.1.3",

From b34c86d8e2cf492feaf377892daa72e3fe5e53df Mon Sep 17 00:00:00 2001
From: Paul Valerie GOMA <paulgoma07@gmail.com>
Date: Thu, 24 Jul 2025 02:47:54 +0200
Subject: [PATCH 11/13] 1.0.8 -> 1.0.9

---
 package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/package.json b/package.json
index 4f3f114..04b8ff0 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@cellule-financiere-pmo/visua-vue",
-  "version": "1.0.8",
+  "version": "1.0.9",
   "type": "module",
   "scripts": {
     "dev": "vite",

From 938a8a345730dbd4bb0941288dfec3e0d26d7061 Mon Sep 17 00:00:00 2001
From: Paul Valerie GOMA <paulgoma07@gmail.com>
Date: Thu, 24 Jul 2025 02:49:01 +0200
Subject: [PATCH 12/13] =?UTF-8?q?=F0=9F=93=9D=20docs:=20README=20file=20up?=
 =?UTF-8?q?dated?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 README.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/README.md b/README.md
index 11390d3..44e4ef0 100644
--- a/README.md
+++ b/README.md
@@ -1,3 +1,3 @@
 # visua-vue
 
-**Current version: v1.0.8**
\ No newline at end of file
+**Current version: v1.0.9**
\ No newline at end of file

From 94c7dd092f78f1998d1dae0574436910c444fe82 Mon Sep 17 00:00:00 2001
From: Paul Valerie GOMA <paulgoma07@gmail.com>
Date: Thu, 24 Jul 2025 02:51:27 +0200
Subject: [PATCH 13/13] =?UTF-8?q?=F0=9F=93=9D=20docs:=20Updated=20CHANGELO?=
 =?UTF-8?q?G=20file?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 CHANGELOG.md | 7 +++++++
 1 file changed, 7 insertions(+)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index ae4a917..15f6f1e 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -5,6 +5,13 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
+## [1.0.9] - 2025-07-24
+### Added
+- Message component
+
+### Changed
+- Badge compoent icon
+
 ## [1.0.8] - 2025-07-23
 ### Added
 - ProgressBar component