feat: add codeblock for message demo

Author: bishalshrestha013

apps/demo/src/Views/Ui/components/Message.tsx

@@ -2,7 +2,7 @@ import { useTranslation } from "@dzangolab/react-i18n";
 import { Button, Message, Page } from "@dzangolab/react-ui";
 import { useNavigate } from "react-router-dom";
 
-import { Section } from "../../../components/Demo";
+import { CodeBlock, Section } from "../../../components/Demo";
 
 export const MessageDemo = () => {
   const [t] = useTranslation("ui");
@@ -23,20 +23,33 @@ export const MessageDemo = () => {
     >
       <Section title={t("message.usage.basic")}>
         <Message message={t("message.contents.content1")} />
+        <CodeBlock exampleCode='<Message message="Season sale: Up to 50% off selected items!" />' />
       </Section>
 
       <Section title={t("message.usage.icons.icon")}>
         <Message
           message={t("message.contents.content2")}
           icon="pi pi-android"
         />
+        <CodeBlock
+          exampleCode='<Message 
+  message="New features just launched! Check them out!"
+  icon="pi pi-android"
+/>'
+        />
       </Section>
 
       <Section title={t("message.usage.icons.iconSlot")}>
         <Message
           message={t("message.contents.content3")}
           icon={<i className="pi pi-bell" />}
         />
+        <CodeBlock
+          exampleCode='<Message 
+  message="New Year, New You: Start fresh with our services!"
+  icon={<i className="pi pi-bell" />}
+/>'
+        />
       </Section>
 
       <Section title={t("message.usage.enableClose")}>
@@ -45,6 +58,13 @@ export const MessageDemo = () => {
           icon={<i className="pi pi-bell" />}
           message={t("message.contents.content4")}
         />
+        <CodeBlock
+          exampleCode='<Message 
+  message="We value your feedback: take our quick survey!"
+  icon={<i className="pi pi-bell" />}
+  enableClose={true}
+/>'
+        />
       </Section>
     </Page>
   );