@v1nt1248/3nclient-lib 0.3.5 → 0.3.7

package/package.json

@@ -2,7 +2,7 @@
   "name": "@v1nt1248/3nclient-lib",
   "license": "AGPL-3.0-or-later",
   "author": "v1nt1248",
-  "version": "0.3.5",
+  "version": "0.3.7",
   "description": "Library for 3NWeb clients",
   "type": "module",
   "files": [

package/src/components/ui3n-dialog/types.ts

@@ -1,7 +1,9 @@
 import type { VNode } from 'vue';
 import type { Ui3nIconField } from '@/types';
 
-export type Ui3nDialogEvent = 'close' | 'confirm' | 'cancel' | 'click-overlay';
+export type Ui3nDialogEventBase = 'close' | 'confirm' | 'cancel' | 'click-overlay';
+
+export type Ui3nDialogEvent<E extends string = never> = Ui3nDialogEventBase | E;
 
 export interface Ui3nDialogComponentProps<V> {
   id?: string;
@@ -28,8 +30,8 @@ export interface Ui3nDialogComponentProps<V> {
   isValid?: boolean;
 }
 
-export interface Ui3nDialogComponentEmits<V> {
-  (event: 'action', value: { event: Ui3nDialogEvent; data?: V }): void;
+export interface Ui3nDialogComponentEmits<V, E extends string = never> {
+  (event: 'action', value: { event: Ui3nDialogEvent<E>; data?: V }): void;
 }
 
 export interface Ui3nDialogComponentSlots {

package/src/components/ui3n-dialog/ui3n-dialog-provider.vue

@@ -1,4 +1,4 @@
-<script lang="ts" setup generic="V extends any">
+<script lang="ts" setup generic="V extends any, E extends string = never">
   /* eslint-disable @typescript-eslint/no-explicit-any */
   import { type Component, inject } from 'vue';
   import type { DialogsPlugin } from '@/plugins';
@@ -12,12 +12,12 @@
     if (
       (modalProps as Ui3nDialogComponentProps<any>).closeOnClickOverlay ||
       ((modalProps as any).dialogProps as Ui3nDialogComponentProps<any>)?.closeOnClickOverlay
-  ) {
+    ) {
       dialogs.$closeDialog(id, { event: 'click-overlay' });
     }
   }
 
-  function onAction(id: string, value: { event: Ui3nDialogEvent; data?:  V }) {
+  function onAction(id: string, value: { event: Ui3nDialogEvent<E>; data?: V }) {
     dialogs.$closeDialog(id, value);
   }
 </script>

package/src/components/ui3n-dialog/ui3n-dialog.vue

@@ -1,4 +1,4 @@
-<script lang="ts" setup generic="V extends any">
+<script lang="ts" setup generic="V extends any, E extends string = never">
   import { computed, nextTick, onMounted, ref, useTemplateRef } from 'vue';
   import omit from 'lodash/omit';
   import { determineWindowWidth } from './util';
@@ -6,24 +6,22 @@
   import Ui3nButton from '../ui3n-button/ui3n-button.vue';
   import Ui3nIcon from '../ui3n-icon/ui3n-icon.vue';
 
-  const props = withDefaults(
-    defineProps<Ui3nDialogComponentProps<V>>(), {
-      cssClass: () => [],
-      cssStyle: () => ({}),
-      contentCssClass: () => [],
-      contentCssStyle: () => ({}),
-      confirmButton: true,
-      cancelButton: true,
-      confirmButtonText: 'Done',
-      cancelButtonText: 'Cancel',
-      confirmButtonColor: 'var(--color-text-button-primary-default)',
-      cancelButtonColor: 'var(--color-text-button-secondary-default)',
-      confirmButtonBackground: 'var(--color-bg-button-primary-default)',
-      cancelButtonBackground: 'var(--color-bg-button-secondary-default)',
-      isValid: true,
-    },
-  );
-  const emits = defineEmits<Ui3nDialogComponentEmits<V>>();
+  const props = withDefaults(defineProps<Ui3nDialogComponentProps<V>>(), {
+    cssClass: () => [],
+    cssStyle: () => ({}),
+    contentCssClass: () => [],
+    contentCssStyle: () => ({}),
+    confirmButton: true,
+    cancelButton: true,
+    confirmButtonText: 'Done',
+    cancelButtonText: 'Cancel',
+    confirmButtonColor: 'var(--color-text-button-primary-default)',
+    cancelButtonColor: 'var(--color-text-button-secondary-default)',
+    confirmButtonBackground: 'var(--color-bg-button-primary-default)',
+    cancelButtonBackground: 'var(--color-bg-button-secondary-default)',
+    isValid: true,
+  });
+  const emits = defineEmits<Ui3nDialogComponentEmits<V, E>>();
   defineSlots<Ui3nDialogComponentSlots>();
 
   const dialogElement = useTemplateRef('dialog-el');
@@ -105,22 +103,13 @@
 
   onMounted(() => {
     if (dialogElement.value) {
-      dialogElement.value.style.setProperty(
-        '--ui3n-dialog-confirm-button-color',
-        props.confirmButtonColor,
-      );
-      dialogElement.value.style.setProperty(
-        '--ui3n-dialog-cancel-button-color',
-        props.cancelButtonColor,
-      );
+      dialogElement.value.style.setProperty('--ui3n-dialog-confirm-button-color', props.confirmButtonColor);
+      dialogElement.value.style.setProperty('--ui3n-dialog-cancel-button-color', props.cancelButtonColor);
       dialogElement.value.style.setProperty(
         '--ui3n-dialog-confirm-background-color',
         props.confirmButtonBackground,
       );
-      dialogElement.value.style.setProperty(
-        '--ui3n-dialog-cancel-background-color',
-        props.cancelButtonBackground,
-      );
+      dialogElement.value.style.setProperty('--ui3n-dialog-cancel-background-color', props.cancelButtonBackground);
 
       nextTick(() => {
         dialogElement.value!.focus();
@@ -145,12 +134,12 @@
     v-on="
       draggable
         ? {
-          dragstart: onDragstart,
-          mousedown: onMousedown,
-          mouseup: onMouseup,
-          mousemove: onMousemove,
-          keydown: onKeydown,
-        }
+            dragstart: onDragstart,
+            mousedown: onMousedown,
+            mouseup: onMouseup,
+            mousemove: onMousemove,
+            keydown: onKeydown,
+          }
         : { keydown: onKeydown }
     "
   >