@v1nt1248/3nclient-lib 0.1.58 → 0.1.59

package/dist/variables.css

@@ -8,6 +8,10 @@
   --spacing-xxl: 48px;
   --white-inf: rgba(255, 255, 255, 0);
   --white-100: #fff;
+  --white-4: rgba(250, 250, 250, 0.04);
+  --white-8: rgba(250, 250, 250, 0.08);
+  --white-12: rgba(250, 250, 250, 0.12);
+  --white-24: rgba(250, 250, 250, 0.24);
   --black-inf: rgba(0, 0, 0, 0);
   --black-4: rgba(0, 0, 0, 0.04);
   --black-8: rgba(0, 0, 0, 0.08);
@@ -749,7 +753,7 @@ html {
   --shadow-key-umbra-opacity: rgba(0, 0, 0, 0.2);
   --shadow-key-penumbra-opacity: rgba(0, 0, 0, 0.14);
   --shadow-key-ambient-opacity: rgba(0, 0, 0, 0.12);
-  
+
   overflow: hidden;
   font-family: Manrope, sans-serif;
 }
@@ -812,7 +816,7 @@ div {
 .ui3n-ripple {
   --ui3n-ripple-duration: 400ms;
   --ui3n-ripple-bg-color: rgba(255, 255, 255, 0.7);
-  
+
   position: absolute;
   border-radius: 50%;
   transform: scale(0);

package/package.json

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

package/src/components/ui3n-drop-files/ui3n-drop-files.vue

@@ -75,41 +75,45 @@
     :class="[
       $style.ui3nDropFiles,
       permanentDisplay && $style.ui3nDropFilesWithBorder,
-      isOverDropPlace || isOverDropZone && $style.ui3nDropFilesWithAccentBorder
+      (isOverDropPlace || isOverDropZone) && $style.ui3nDropFilesWithAccentBorder
     ]"
     @dragenter="onDragenter"
     @dragleave="onDragleave"
   >
     <slot />
+
     <div
+      v-if="permanentDisplay || isOverDropPlace || isOverDropZone"
       :class="$style.ui3nDropFilesDropzone"
       @dragenter="onDropzoneDragenter"
       @dragover="onDropzoneDragover"
       @dragleave="onDropzoneDragleave"
       @drop="onDrop"
     >
-      <template v-if="permanentDisplay || isOverDropPlace || isOverDropZone">
-        <h3 :class="$style.ui3nDropFilesDropzoneTitle">
-          {{ title }}
-        </h3>
-
-        <div :class="$style.ui3nDropFilesDropzoneIcon">
-          <svg
-            :width="wrapperElementMinSize * 0.35"
-            :height="wrapperElementMinSize * 0.35"
-            viewBox="0 0 192 192"
-            fill="none"
-            xmlns="http://www.w3.org/2000/svg"
-          >
-            <path
-              d="M51 152C47.9333 152 45.3333 150.934 43.2 148.8C41.0667 146.667 40 144.067 40 141V119.8H46.2V141C46.2 142.2 46.7 143.3 47.7 144.3C48.7 145.3 49.8 145.8 51 145.8H141C142.2 145.8 143.3 145.3 144.3 144.3C145.3 143.3 145.8 142.2 145.8 141V119.8H152V141C152 144.067 150.933 146.667 148.8 148.8C146.667 150.934 144.067 152 141 152H51ZM93 122.4V49.2002L72.8 69.2002L68.4 65.0002L96 37.2002L123.6 65.0002L119.2 69.2002L99 49.2002V122.4H93Z"
-              fill="var(--color-icon-control-primary-default)"
-            />
-          </svg>
-        </div>
-      </template>
-
-      <div :class="$style.ui3nDropFilesDropzoneAdditional">
+      <h3 :class="$style.ui3nDropFilesDropzoneTitle">
+        {{ title }}
+      </h3>
+
+      <div :class="$style.ui3nDropFilesDropzoneIcon">
+        <svg
+          :width="wrapperElementMinSize * 0.35"
+          :height="wrapperElementMinSize * 0.35"
+          viewBox="0 0 192 192"
+          fill="none"
+          xmlns="http://www.w3.org/2000/svg"
+        >
+          <path
+            d="M51 152C47.9333 152 45.3333 150.934 43.2 148.8C41.0667 146.667 40 144.067 40 141V119.8H46.2V141C46.2 142.2 46.7 143.3 47.7 144.3C48.7 145.3 49.8 145.8 51 145.8H141C142.2 145.8 143.3 145.3 144.3 144.3C145.3 143.3 145.8 142.2 145.8 141V119.8H152V141C152 144.067 150.933 146.667 148.8 148.8C146.667 150.934 144.067 152 141 152H51ZM93 122.4V49.2002L72.8 69.2002L68.4 65.0002L96 37.2002L123.6 65.0002L119.2 69.2002L99 49.2002V122.4H93Z"
+            fill="var(--color-icon-control-primary-default)"
+          />
+        </svg>
+      </div>
+
+      <div
+        :class="$style.ui3nDropFilesDropzoneAdditional"
+        @dragenter.stop.prevent
+        @dragleave.stop.prevent
+      >
         <slot name="additional-text" />
       </div>
     </div>

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

@@ -17,7 +17,7 @@
 
   onMounted(() => {
     if (emojiElement.value) {
-      emojiElement.value.style.setProperty('--emoji-size', `${props.size}px`);
+      emojiElement.value.style.setProperty('--ui3n-emoji-size', `${props.size}px`);
     }
   });