@vc-shell/framework 1.0.327 → 1.0.329

package/dist/ui/components/organisms/vc-blade/vc-blade.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"vc-blade.vue.d.ts","sourceRoot":"","sources":["../../../../../ui/components/organisms/vc-blade/vc-blade.vue.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,aAAa,EAAE,MAAM,wBAAwB,CAAC;AASvD,MAAM,WAAW,KAAK;IACpB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,YAAY,CAAC,EAAE,aAAa,EAAE,CAAC;IAC/B,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,WAAW,KAAK;IACpB,CAAC,KAAK,EAAE,OAAO,GAAG,IAAI,CAAC;IACvB,CAAC,KAAK,EAAE,QAAQ,GAAG,IAAI,CAAC;IACxB,CAAC,KAAK,EAAE,UAAU,GAAG,IAAI,CAAC;CAC3B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsaD,wBAAwG;AACxG,KAAK,sBAAsB,CAAC,CAAC,IAAI,CAAC,SAAS,SAAS,GAAG,KAAK,GAAG,CAAC,CAAC;AACjE,KAAK,6BAA6B,CAAC,CAAC,IAAI;KAAG,CAAC,IAAI,MAAM,CAAC,CAAC,CAAC,GAAG,EAAE,SAAS,IAAI,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG;QAAE,IAAI,EAAE,OAAO,KAAK,EAAE,QAAQ,CAAC,sBAAsB,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAA;KAAE,GAAG;QAAE,IAAI,EAAE,OAAO,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QAAC,QAAQ,EAAE,IAAI,CAAA;KAAE;CAAE,CAAC;AAC9M,KAAK,kBAAkB,CAAC,CAAC,EAAE,CAAC,IAAI;KAE1B,CAAC,IAAI,MAAM,IAAI,CAAC,CAAC,EAAE,MAAM,CAAC,CAAC,GAAG,CAAC,SAAS,MAAM,CAAC,GAAG,cAAc,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG;QACxE,OAAO,EAAE,CAAC,CAAC,CAAC,CAAC,CAAA;KACb,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CACT,CAAC;AACN,KAAK,cAAc,CAAC,CAAC,IAAI;KAAG,CAAC,IAAI,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CAAG,GAAG,EAAE,CAAC;AACxD,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAAE,QAAO;QAClD,MAAM,EAAE,CAAC,CAAC;KACT,CAAA;CAAE,CAAC"}
+{"version":3,"file":"vc-blade.vue.d.ts","sourceRoot":"","sources":["../../../../../ui/components/organisms/vc-blade/vc-blade.vue.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,aAAa,EAAE,MAAM,wBAAwB,CAAC;AASvD,MAAM,WAAW,KAAK;IACpB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,YAAY,CAAC,EAAE,aAAa,EAAE,CAAC;IAC/B,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,WAAW,KAAK;IACpB,CAAC,KAAK,EAAE,OAAO,GAAG,IAAI,CAAC;IACvB,CAAC,KAAK,EAAE,QAAQ,GAAG,IAAI,CAAC;IACxB,CAAC,KAAK,EAAE,UAAU,GAAG,IAAI,CAAC;CAC3B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA+aD,wBAAwG;AACxG,KAAK,sBAAsB,CAAC,CAAC,IAAI,CAAC,SAAS,SAAS,GAAG,KAAK,GAAG,CAAC,CAAC;AACjE,KAAK,6BAA6B,CAAC,CAAC,IAAI;KAAG,CAAC,IAAI,MAAM,CAAC,CAAC,CAAC,GAAG,EAAE,SAAS,IAAI,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG;QAAE,IAAI,EAAE,OAAO,KAAK,EAAE,QAAQ,CAAC,sBAAsB,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAA;KAAE,GAAG;QAAE,IAAI,EAAE,OAAO,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QAAC,QAAQ,EAAE,IAAI,CAAA;KAAE;CAAE,CAAC;AAC9M,KAAK,kBAAkB,CAAC,CAAC,EAAE,CAAC,IAAI;KAE1B,CAAC,IAAI,MAAM,IAAI,CAAC,CAAC,EAAE,MAAM,CAAC,CAAC,GAAG,CAAC,SAAS,MAAM,CAAC,GAAG,cAAc,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG;QACxE,OAAO,EAAE,CAAC,CAAC,CAAC,CAAC,CAAA;KACb,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CACT,CAAC;AACN,KAAK,cAAc,CAAC,CAAC,IAAI;KAAG,CAAC,IAAI,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CAAG,GAAG,EAAE,CAAC;AACxD,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAAE,QAAO;QAClD,MAAM,EAAE,CAAC,CAAC;KACT,CAAA;CAAE,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vc-shell/framework",
-  "version": "1.0.327",
+  "version": "1.0.329",
   "type": "module",
   "main": "./dist/framework.js",
   "types": "./dist/index.d.ts",
@@ -59,9 +59,9 @@
   },
   "devDependencies": {
     "@types/dompurify": "^3.0.5",
-    "@vc-shell/api-client-generator": "^1.0.327",
-    "@vc-shell/config-generator": "^1.0.327",
-    "@vc-shell/ts-config": "^1.0.327",
+    "@vc-shell/api-client-generator": "^1.0.329",
+    "@vc-shell/config-generator": "^1.0.329",
+    "@vc-shell/ts-config": "^1.0.329",
     "@vitejs/plugin-vue": "5.0.3",
     "cypress-signalr-mock": "^1.5.0",
     "sass": "^1.69.6",

package/shared/components/common/popup/vc-popup-error.vue

@@ -5,6 +5,12 @@
     :title="title"
     @close="$emit('close')"
   >
+    <template
+      v-if="$slots.header"
+      #header
+    >
+      <slot name="header" />
+    </template>
     <template #content>
       <slot />
     </template>
@@ -35,6 +41,11 @@ export interface Emits {
 defineProps<Props>();
 
 defineEmits<Emits>();
+
+defineSlots<{
+  header: void;
+  default: void;
+}>();
 </script>
 
 <style lang="scss">

package/shared/components/common/popup/vc-popup-info.vue

@@ -5,6 +5,12 @@
     :title="title"
     @close="$emit('close')"
   >
+    <template
+      v-if="$slots.header"
+      #header
+    >
+      <slot name="header" />
+    </template>
     <template #content>
       <slot />
     </template>
@@ -35,6 +41,11 @@ export interface Emits {
 defineProps<Props>();
 
 defineEmits<Emits>();
+
+defineSlots<{
+  header: void;
+  default: void;
+}>();
 </script>
 
 <style lang="scss">

package/shared/components/common/popup/vc-popup-warning.vue

@@ -5,6 +5,12 @@
     :title="title"
     @close="$emit('close')"
   >
+    <template
+      v-if="$slots.header"
+      #header
+    >
+      <slot name="header" />
+    </template>
     <template #content>
       <slot />
     </template>
@@ -38,6 +44,11 @@ export interface Emits {
 defineProps<Props>();
 
 defineEmits<Emits>();
+
+defineSlots<{
+  header: void;
+  default: void;
+}>();
 </script>
 
 <style lang="scss">

package/shared/components/notification-dropdown/_internal/notification/notification.vue

@@ -1,11 +1,14 @@
 <template>
   <div class="tw-flex">
     <VcRow class="tw-justify-between tw-grow tw-basis-0 !tw-flex">
-      <template v-if="currentTemplate">
-        <notificationTemplateRenderer />
-      </template>
-      <template v-else>
+      <div @click="handleClick">
+        <component
+          :is="currentTemplate"
+          v-if="currentTemplate"
+          v-bind="templateProps"
+        />
         <NotificationTemplate
+          v-else
           :color="notificationStyle.color"
           :title="notification.title ?? ''"
           :icon="notificationStyle.icon"
@@ -14,20 +17,20 @@
           <VcHint
             v-if="notification.description"
             class="tw-mb-1"
-            >{{ notification.description }}</VcHint
           >
+            {{ notification.description }}
+          </VcHint>
         </NotificationTemplate>
-      </template>
+      </div>
     </VcRow>
   </div>
 </template>
 
 <script lang="ts" setup>
-import { computed, h } from "vue";
+import { computed } from "vue";
 import { PushNotification } from "./../../../../../core/api/platform";
-import { VcRow } from "./../../../../../ui/components";
-import { NotificationTemplate } from "./../../../notification-template";
 import { NotificationTemplateConstructor } from "../../../../../core/types";
+import { NotificationTemplate } from "../../../notification-template";
 
 export interface Props {
   notification: PushNotification;
@@ -35,28 +38,26 @@ export interface Props {
 }
 
 export interface Emits {
-  (event: "onClick"): void;
+  (event: "onClick", notification: PushNotification): void;
 }
 
 const props = defineProps<Props>();
-
 const emit = defineEmits<Emits>();
 
+const currentTemplate = computed(() => props.templates?.find((x) => x?.notifyType === props.notification.notifyType));
+
+const templateProps = computed(() => ({
+  notification: props.notification,
+}));
+
+const handleClick = () => {
+  emit("onClick", props.notification);
+};
+
 const notificationStyle = computed(() => ({
   color: "var(--notification-icon-color)",
   icon: "fas fa-info",
 }));
-
-const currentTemplate = computed(() => props.templates?.find((x) => x?.notifyType === props.notification.notifyType));
-
-function notificationTemplateRenderer() {
-  const notificationTemplate = currentTemplate.value;
-
-  return (
-    notificationTemplate &&
-    h(notificationTemplate, { notification: props.notification, onNotificationClick: () => emit("onClick") })
-  );
-}
 </script>
 
 <style lang="scss">

package/shared/components/notification-dropdown/notification-dropdown.vue

@@ -123,7 +123,7 @@ function onOpen(state: boolean) {
 
   &__item {
     @apply tw-py-[18px] tw-px-[15px] tw-border-b tw-border-solid
-      tw-border-b-[var(--notification-dropdown-border-color)] tw-cursor-pointer;
+      tw-border-b-[var(--notification-dropdown-border-color)];
     transition: background-color 0.2s;
 
     &:last-of-type {

package/shared/components/notification-template/notification-template.vue

@@ -1,5 +1,10 @@
 <template>
-  <div class="vc-notification-template">
+  <div
+    class="vc-notification-template"
+    :class="{ 'vc-notification-template--clickable': $attrs.onClick }"
+    v-bind="$attrs"
+    @click="handleTemplateClick"
+  >
     <div
       class="vc-notification-template__container"
       :class="{
@@ -24,7 +29,10 @@
           >
             {{ title }}
           </p>
-          <slot></slot>
+          <slot
+            v-bind="$attrs"
+            v-on="$attrs"
+          ></slot>
         </div>
       </div>
       <div
@@ -50,15 +58,29 @@ export interface Props {
   icon: string;
   title: string;
   notification: PushNotification;
+  clickable?: boolean;
+}
+
+export interface Emits {
+  (event: "onClick", notification: PushNotification): void;
 }
 
 const props = defineProps<Props>();
+const emit = defineEmits<Emits>();
 
 const locale = window.navigator.language;
 
 const pushTime = computed(() => {
   return moment(props.notification.created).locale(locale).format("L LT");
 });
+
+const handleTemplateClick = () => {
+  emit("onClick", props.notification);
+};
+
+defineOptions({
+  inheritAttrs: false,
+});
 </script>
 
 <style lang="scss">
@@ -71,6 +93,10 @@ const pushTime = computed(() => {
 .vc-notification-template {
   @apply tw-w-full;
 
+  &--clickable {
+    cursor: pointer;
+  }
+
   &__container {
     @apply tw-flex tw-flex-row tw-justify-between tw-grow tw-basis-0;
 
@@ -84,13 +110,11 @@ const pushTime = computed(() => {
   }
 
   &__icon-container {
-    @apply tw-w-[41px] tw-h-[41px] tw-rounded-full tw-text-[color:var(--notification-template-icon-color)]
-      tw-mr-4 tw-flex tw-items-center tw-justify-center tw-shrink-0;
+    @apply tw-w-[41px] tw-h-[41px] tw-rounded-full tw-text-[color:var(--notification-template-icon-color)] tw-mr-4 tw-flex tw-items-center tw-justify-center tw-shrink-0;
   }
 
   &__title {
-    @apply tw-text-[color:var(--notification-template-text-color)] tw-text-lg tw-leading-[19px]
-      tw-font-bold tw-m-0 tw-mb-1;
+    @apply tw-text-[color:var(--notification-template-text-color)] tw-text-lg tw-leading-[19px] tw-font-bold tw-m-0 tw-mb-1;
     word-break: break-word;
 
     &--desktop {

package/ui/components/organisms/vc-blade/vc-blade.vue

@@ -136,13 +136,13 @@
 </template>
 
 <script lang="ts" setup>
-import { computed, Ref, reactive, useAttrs, toRefs, toValue, ref, onMounted, onUpdated } from "vue";
+import { computed, Ref, reactive, useAttrs, toRefs, toValue, ref, onMounted, onUpdated, defineComponent, h } from "vue";
 import { IBladeToolbar } from "../../../../core/types";
 import { usePopup } from "./../../../../shared";
 import { useI18n } from "vue-i18n";
 import VcBladeHeader from "./_internal/vc-blade-header/vc-blade-header.vue";
 import VcBladeToolbar from "./_internal/vc-blade-toolbar/vc-blade-toolbar.vue";
-import { VcButton, VcIcon } from "./../../";
+import { VcButton, VcIcon, VcLink } from "./../../";
 import vcPopupError from "../../../../shared/components/common/popup/vc-popup-error.vue";
 import { useLocalStorage } from "@vueuse/core";
 
@@ -216,11 +216,20 @@ onUpdated(() => {
 
 const { open } = usePopup({
   component: vcPopupError,
-  props: {
-    title: t("COMPONENTS.ORGANISMS.VC_BLADE.ERROR_POPUP.TITLE"),
-  },
   slots: {
     default: computed(() => toValue(error)),
+    header: defineComponent({
+      render: () =>
+        h("div", [
+          t("COMPONENTS.ORGANISMS.VC_BLADE.ERROR_POPUP.TITLE"),
+          " ",
+          h(
+            VcLink,
+            { onClick: () => navigator.clipboard.writeText(toValue(error) ?? "") },
+            `(${t("COMPONENTS.ORGANISMS.VC_BLADE.ERROR_POPUP.COPY_ERROR")})`,
+          ),
+        ]),
+    }),
   },
 });
 </script>