@creative-web-solution/front-library 7.1.42 → 7.1.44

package/CHANGELOG.md

@@ -1,5 +1,13 @@
 # CHANGELOG
 
+## 7.1.44
+
+* [SkinSelect]: Fix click handler on full skinned select
+
+## 7.1.43
+
+* [Validator]: Add max file size validation
+
 ## 7.1.42
 
 * [Popin]: Add popin element in callback function param

package/Modules/SkinSelect.ts

@@ -116,6 +116,7 @@ export default class SkinSelect implements FLib.SkinSelect.SkinSelect {
 
             on( this.#$parent, {
                 "eventsName": "click",
+                "selector": `.${ this.#options.itemClassName }`,
                 "callback":   this.#fakeOptionsClickHandler
             } );
 
@@ -461,6 +462,7 @@ export default class SkinSelect implements FLib.SkinSelect.SkinSelect {
         if ( !$target.matches( '.' + this.#options.itemClassName ) ) {
             return;
         }
+
         this.selectByOption( $target );
     }
 
@@ -517,11 +519,11 @@ export default class SkinSelect implements FLib.SkinSelect.SkinSelect {
 
 
     #onKeydown = ( e: KeyboardEvent ): void => {
-        switch ( e.keyCode ) {
-            case 38: // UP
-            case 40: // DOWN
-            case 13: // ENTER
-            case 27: // ESCAPE
+        switch ( e.key ) {
+            case "ArrowUp":
+            case "ArrowDown":
+            case "Enter":
+            case "Escape":
                 e.preventDefault();
                 break;
         }
@@ -529,11 +531,11 @@ export default class SkinSelect implements FLib.SkinSelect.SkinSelect {
 
 
     #onKeyup = ( e: KeyboardEvent ): void => {
-        switch ( e.keyCode ) {
-            case 38: // UP
+        switch ( e.key ) {
+            case "ArrowUp":
                 this.#focusItem( this.#focusedItemIndex - 1 );
                 break;
-            case 40: // DOWN
+            case "ArrowDown":
                 if ( !this.#isListOpened ) {
                     this.#openList();
                     break;
@@ -541,8 +543,8 @@ export default class SkinSelect implements FLib.SkinSelect.SkinSelect {
                 this.#focusItem( this.#focusedItemIndex + 1 );
                 break;
 
-            case 13: // ENTER
-            case 32: // SPACE
+            case "Enter":
+            case " ":
                 if ( !this.#isListOpened ) {
                     this.#openList();
                     break;
@@ -551,7 +553,7 @@ export default class SkinSelect implements FLib.SkinSelect.SkinSelect {
                 this.#closeList();
                 break;
 
-            case 27: // ESCAPE
+            case "Escape":
                 this.#closeList();
                 break;
         }

package/Modules/Validator/MaxFileSize.ts

@@ -0,0 +1,30 @@
+import { addValidator } from './index';
+
+/**
+ * File size validation
+ */
+addValidator( 'maxfilesize', '[data-max-file-size]', ( $input, value, isLiveValidation ) => {
+    if (!($input as HTMLInputElement).files?.length) {
+        return Promise.resolve({
+            $input,
+            value,
+            "isValid": true,
+            "label": "maxfilesize",
+            isLiveValidation
+        });
+    }
+
+    const size = ($input as HTMLInputElement).files![0].size;
+    const maxSize = Number($input.getAttribute('data-max-file-size') ?? "0");
+    console.log({size, maxSize})
+    return Promise.resolve({
+        $input,
+        value,
+        "isValid": ($input as HTMLInputElement).files?.length === 0 ||
+                    size <= 0 ||
+                    maxSize <= 0 ||
+                    size <= maxSize,
+        "label": "maxfilesize",
+        isLiveValidation
+    });
+} );

package/README.md

@@ -1,6 +1,6 @@
 # Front Library
 
-@version: 7.1.42
+@version: 7.1.44
 
 
 ## Use

package/package.json

@@ -2,7 +2,7 @@
   "name": "@creative-web-solution/front-library",
   "title": "Frontend library",
   "description": "Frontend functions and modules",
-  "version": "7.1.42",
+  "version": "7.1.44",
   "homepage": "https://github.com/creative-web-solution/front-library",
   "author": "Creative Web Solution <contact@cws-studio.com> (https://www.cws-studio.com)",
   "keywords": [],