@v1nt1248/3nclient-lib 0.2.92 → 0.2.94

package/package.json

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

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

@@ -9,6 +9,7 @@ export interface Ui3nDialogComponentProps<V> {
   icon?: string | Ui3nIconField;
   width?: string | number;
   draggable?: boolean;
+  hideCloseButton?: boolean;
   cssClass?: string[];
   cssStyle?: Record<string, string>;
   contentCssClass?: string[];

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

@@ -156,7 +156,7 @@
   >
     <!-- HEADER  -->
     <div
-      v-if="title"
+      v-if="title && !$slots['header']"
       :class="[$style.title, $style.titleDefault]"
     >
       <ui3n-icon
@@ -175,6 +175,7 @@
       <slot name="header" />
     </div>
 
+    <!-- BODY  -->
     <div
       v-if="$slots['body']"
       :class="$style.content"
@@ -182,8 +183,9 @@
       <slot name="body" />
     </div>
 
+    <!-- ACTIONS  -->
     <div
-      v-if="confirmButton || cancelButton"
+      v-if="(confirmButton || cancelButton) && !$slots['actions']"
       :class="[$style.actions, $style.actionsDefault]"
     >
       <ui3n-button
@@ -223,6 +225,7 @@
     </div>
 
     <ui3n-button
+      v-if="!hideCloseButton"
       :class="$style.closeBtn"
       type="icon"
       size="small"

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

@@ -7,7 +7,7 @@
   const props = defineProps<Ui3nInputProps>();
   const emits = defineEmits<Ui3nInputEmits>();
 
-  const $css = useCssModule();
+  const css = useCssModule();
 
   const inputElement = ref<HTMLInputElement | null>(null);
   const text = ref<string>('');
@@ -32,29 +32,29 @@
   });
 
   const mainCssClasses = computed(() => {
-    const val = [$css.ui3nInput];
-    props.label && val.push($css.withLabel);
-    props.icon && val.push($css.withIcon);
-    props.clearable && text.value && val.push($css.clearable);
-    props.disabled && val.push($css.disabled);
-    ((!!errorMessage.value && !isValid.value) || props.displayStateMode === 'error') && val.push($css.error);
-    props.displayStateMode === 'success' && val.push($css.success);
+    const val = [css.ui3nInput];
+    props.label && val.push(css.withLabel);
+    props.icon && val.push(css.withIcon);
+    props.clearable && text.value && val.push(css.clearable);
+    props.disabled && val.push(css.disabled);
+    ((!!errorMessage.value && !isValid.value) || props.displayStateMode === 'error') && val.push(css.error);
+    props.displayStateMode === 'success' && val.push(css.success);
 
     return val;
   });
 
   const iconCssClasses = computed(() => {
-    const val = [$css.ui3nInputIcon];
-    props.disabled && val.push($css.ui3nInputIconDisabled);
+    const val = [css.ui3nInputIcon];
+    props.disabled && val.push(css.ui3nInputIconDisabled);
 
     return val;
   });
 
   const messageCssClasses = computed(() => {
-    const val = [$css.ui3nInputFieldMessage];
+    const val = [css.ui3nInputFieldMessage];
     (errorMessage.value || (props.displayStateMode === 'error' && !!props.displayStateMessage)) &&
-    val.push($css.ui3nInputErrorMessage);
-    props.displayStateMode === 'success' && props.displayStateMessage && val.push($css.ui3nInputSuccessMessage);
+      val.push(css.ui3nInputErrorMessage);
+    props.displayStateMode === 'success' && props.displayStateMessage && val.push(css.ui3nInputSuccessMessage);
 
     return val;
   });
@@ -185,12 +185,12 @@
       :class="$style.ui3nInputField"
       @input="onInput"
       @keydown.enter="onEnterKeydown"
-      @keydown.escape="onEscapeKeydown"
+      @keydown.esc="onEscapeKeydown"
       @keydown="onKeydown"
       @focusin="onFocus"
       @focusout="onBlur"
       @change="onChange"
-    >
+    />
 
     <ui3n-icon
       v-if="icon"
@@ -238,7 +238,7 @@
 
     position: relative;
     width: 100%;
-    padding: 1px;
+    padding: 1px 1px 15px 1px;
     border-radius: var(--spacing-xs);
 
     &:hover {
@@ -323,11 +323,14 @@
   }
 
   .ui3nInputFieldMessage {
+    position: absolute;
+    left: 0;
+    width: 100%;
+    top: 55px;
     font-style: italic;
     font-size: var(--font-10);
     font-weight: 400;
-    line-height: 1.4;
-    margin-top: 2px;
+    line-height: 1.1;
 
     &.ui3nInputErrorMessage {
       color: var(--error-content-default);