@v1nt1248/3nclient-lib 0.1.57 → 0.1.59

package/dist/utils/files/b64-to-blob.d.ts

@@ -0,0 +1 @@
+export declare function b64ToBlob(b64: string, type?: string): Blob;

package/dist/utils/files/blob-to-b64.d.ts

@@ -0,0 +1 @@
+export declare function blobToB64(blob: Blob): Promise<string>;

package/dist/utils/files/create-video-thumbnail.d.ts

@@ -0,0 +1,2 @@
+import { Nullable } from '../../components/types';
+export declare function createVideoThumbnail(file: File, targetSize: number, seekTo: number): Promise<Nullable<string>>;

package/dist/utils/files/format-file-size.d.ts

@@ -0,0 +1 @@
+export declare function formatFileSize(size?: number): string;

package/dist/utils/files/get-file-extension.d.ts

@@ -0,0 +1 @@
+export declare function getFileExtension(fullName?: string): string;

package/dist/utils/files/is-file-image.d.ts

@@ -0,0 +1 @@
+export declare function isFileImage(type: string, fullName?: string): boolean;

package/dist/utils/files/is-file-video.d.ts

@@ -0,0 +1 @@
+export declare function isFileVideo(type: string, fullName?: string): boolean;

package/dist/utils/files/resize-image.d.ts

@@ -0,0 +1,7 @@
+/**
+ * resize image
+ * @param imageBase64 {string} - image (base64)
+ * @param targetSize {number} -  target size of the smaller side of the image
+ * @return {string} (base64)
+ */
+export declare function resizeImage(imageBase64: string, targetSize: number): Promise<string>;

package/dist/utils/files/uint8-to-b64.d.ts

@@ -0,0 +1 @@
+export declare function uint8ToBase64(inputData: Uint8Array, type?: string): string;

package/dist/utils/for-we3n.d.ts

@@ -0,0 +1,2 @@
+export declare function getDeliveryErrors(progress: web3n.asmail.DeliveryProgress): Record<string, string>;
+export declare function transformFileToWeb3NFile(file: File): Promise<web3n.files.File | undefined>;

package/dist/utils/get-random-id.d.ts

@@ -0,0 +1 @@
+export declare function getRandomId(numOfChars: number): string;

package/dist/utils/index.d.ts

@@ -2,9 +2,26 @@ export * from './processes/deferred';
 export * from './processes/sleep';
 export * from './processes/single';
 export * from './processes/named-procs';
+export * from './round';
+export * from './get-random-id';
 export * from './textarea-max-rows';
-export * from './common';
-export * from './ui';
-export * from './selection';
+export * from './for-we3n';
+export * from './ui/selection';
+export * from './ui/mark-search';
+export * from './ui/has-slot-content';
+export * from './ui/get-element-color';
+export * from './ui/invert-color';
+export * from './ui/html2text';
+export * from './ui/prepare-date-as-string';
+export * from './ui/capitalize';
+export * from './files/format-file-size';
+export * from './files/get-file-extension';
+export * from './files/is-file-image';
+export * from './files/is-file-video';
+export * from './files/blob-to-b64';
+export * from './files/b64-to-blob';
+export * from './files/uint8-to-b64';
+export * from './files/resize-image';
+export * from './files/create-video-thumbnail';
 export { SQLiteOn3NStorage } from './sqlite-on-3nstorage';
 export type { BindParams, Database, QueryExecResult } from './sqlite-on-3nstorage';

package/dist/utils/round.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Rounding with a given accuracy
+ * @param num {number}
+ * @param precision {number} - rounding accuracy (number of digits after the decimal point
+ * indicated with the "-" sign)
+ * @return {number}
+ */
+export declare function round(num: number, precision: number): number;

package/dist/utils/ui/capitalize.d.ts

@@ -0,0 +1 @@
+export declare function capitalize(text: string): string;

package/dist/utils/ui/get-element-color.d.ts

@@ -0,0 +1 @@
+export declare function getElementColor(initials?: string): string;

package/dist/utils/ui/has-slot-content.d.ts

@@ -0,0 +1,2 @@
+import { Slot } from 'vue';
+export declare function hasSlotContent(slot?: Slot, slotProps?: {}): boolean;

package/dist/utils/ui/html2text.d.ts

@@ -0,0 +1 @@
+export declare function html2text(html: string): string;

package/dist/utils/ui/invert-color.d.ts

@@ -0,0 +1 @@
+export declare function invertColor(color: string): string;

package/dist/utils/ui/mark-search.d.ts

@@ -0,0 +1 @@
+export declare function markSearch(str: string, search: string): string;

package/dist/utils/ui/prepare-date-as-string.d.ts

@@ -0,0 +1,8 @@
+/**
+ * @param {number} ts - timestamp
+ * @return {string} - times as string%
+ * If TS is today, then Date returns as a string 'HH:mm'
+ * If ts is period between 3 day before today and today, then Date returns as a string '{1|2|3} days ago'
+ * Else Date returns as a string 'YYYY-MM-DD'
+ */
+export declare function prepareDateAsSting(ts: number): string;

package/dist/variables.css

@@ -6,9 +6,12 @@
   --spacing-l: 32px;
   --spacing-xl: 40px;
   --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);
@@ -100,7 +103,6 @@
   --files-pdf-secondary: #fdc7c3;
   --files-image-primary: #4744e4;
   --files-image-secondary: #c9c8ff;
-  
   --font-6: 6px;
   --font-8: 8px;
   --font-9: 9px;
@@ -744,7 +746,6 @@
   --color-icon-chat-bubble-user-selected: var(--accent-content-default);
   --color-icon-chat-bubble-other-default: var(--default-content-default);
   --color-icon-chat-bubble-other-selected: var(--accent-content-selected);
-  
   --effect-dropdown-shadow: 0 0 4px 0 var(--shadow-close), 0 4px 12px 0 var(--shadow-far);
 }
 
@@ -752,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;
 }
@@ -815,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);
@@ -833,9 +834,10 @@ div {
   font-size: var(--font-11);
   line-height: var(--font-12);
   font-weight: 400;
-  background-color: var(--color-bg-control-secondary-default);
-  color: var(--color-text-control-primary-default);
+  word-wrap: break-word;
+  white-space: break-spaces;
   box-shadow: 0 2px 1px -1px rgba(0, 0, 0, 0.2),
   0 1px 1px 0 rgba(0, 0, 0, 0.14),
   0 1px 3px 0 rgba(0, 0, 0, 0.12);
+  z-index: 1000;
 }

package/package.json

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

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

@@ -290,8 +290,13 @@ onMounted(() => {
   flex-direction: row-reverse;
 }
 
-.buttonIcon,
+.buttonIcon {
+  pointer-events: none;
+}
+
 .text {
+  display: inline-block;
+  max-width: 100%;
   pointer-events: none;
 }
 

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`);
     }
   });
 

package/src/components/ui3n-table/ui3n-table-sort-icon.vue

@@ -12,8 +12,8 @@
 <template>
   <transition mode="out-in" name="fade">
     <ui3n-icon
-      :key="value === 'asc' ? 'round-arrow-downward' : 'round-arrow-upward'"
-      :icon="value === 'asc' ? 'round-arrow-downward' : 'round-arrow-upward'"
+      :key="value === 'asc' ? 'round-arrow-upward' : 'round-arrow-downward'"
+      :icon="value === 'asc' ? 'round-arrow-upward' : 'round-arrow-downward'"
       :width="iconSize"
       :height="iconSize"
       :color="iconColor"

package/dist/utils/common.d.ts

@@ -1,12 +0,0 @@
-export declare function getRandomId(numOfChars: number): string;
-export declare function getDeliveryErrors(progress: web3n.asmail.DeliveryProgress): Record<string, string>;
-export declare function transformFileToWeb3NFile(file: File): Promise<web3n.files.File | undefined>;
-export declare function markSearch(str: string, search: string): string;
-/**
- * Rounding with a given accuracy
- * @param num {number}
- * @param precision {number} - rounding accuracy (number of digits after the decimal point
- * indicated with the "-" sign)
- * @return {number}
- */
-export declare function round(num: number, precision: number): number;

package/dist/utils/ui.d.ts

@@ -1,15 +0,0 @@
-import { Slot } from 'vue';
-export declare function hasSlotContent(slot?: Slot, slotProps?: {}): boolean;
-export declare function getElementColor(initials?: string): string;
-export declare function invertColor(color: string): string;
-export declare function html2text(html: string): string;
-/**
- * @param {number} ts - timestamp
- * @return {string} - times as string%
- * If TS is today, then Date returns as a string 'HH:mm'
- * If ts is period between 3 day before today and today, then Date returns as a string '{1|2|3} days ago'
- * Else Date returns as a string 'YYYY-MM-DD'
- */
-export declare function prepareDateAsSting(ts: number): string;
-export declare function capitalize(text: string): string;
-export declare function formatFileSize(size: number): string;