chore: uploader cases tune WIP 2

uploadcare · Apr 12, 2022 · 6a78077 · 6a78077
1 parent fc312d1
commit 6a78077
Show file tree

Hide file tree

Showing 12 changed files with 34 additions and 29 deletions.
diff --git a/.stylelintrc b/.stylelintrc
diff --git a/.stylelintrc.cjs b/.stylelintrc.cjs
@@ -10,6 +10,7 @@ module.exports = {
     'declaration-block-no-redundant-longhand-properties': null,
     'custom-property-empty-line-before': null,
     'length-zero-no-unit': null,
+    'no-descending-specificity': null,
     'value-keyword-case': [
       'lower',
       {

diff --git a/abstract/Block.js b/abstract/Block.js
@@ -118,10 +118,11 @@ export class Block extends BaseComponent {
         'confirm-upload',
         'init-activity',
         'done-activity',
+        'cancel-activity',
       ];
       unprefixedCfgProps.forEach((prop) => {
         this.bindCssData(`--cfg-${prop}`);
-      });
+      }, true);
       Block._cssDataBindingsList.push(this.ctxName);
     }
   }
@@ -202,12 +203,16 @@ export class Block extends BaseComponent {
     };
   }
 
+  get initActivity() {
+    return this.$['*--cfg-init-activity'];
+  }
+
   get doneActivity() {
-    return this.getAttribute('done-activity');
+    return this.$['*--cfg-done-activity'];
   }
 
   get cancelActivity() {
-    return this.getAttribute('cancel-activity');
+    return this.$['*--cfg-cancel-activity'];
   }
 
   get isActivityActive() {
@@ -332,7 +337,7 @@ export class Block extends BaseComponent {
 
 /** @enum {String} */
 Block.activities = Object.freeze({
-  SOURCE_SELECT: 'source-select',
+  START_FROM: 'start-from',
   CAMERA: 'camera',
   DRAW: 'draw',
   UPLOAD_LIST: 'upload-list',

diff --git a/blocks/CameraSource/CameraSource.js b/blocks/CameraSource/CameraSource.js
@@ -19,7 +19,7 @@ export class CameraSource extends Block {
 
     onCancel: () => {
       this.set$({
-        '*currentActivity': Block.activities.SOURCE_SELECT,
+        '*currentActivity': this.cancelActivity,
       });
     },
     onShot: () => {

diff --git a/blocks/ExternalSource/ExternalSource.js b/blocks/ExternalSource/ExternalSource.js
@@ -13,7 +13,7 @@ export class ExternalSource extends Block {
     },
     onCancel: () => {
       this.set$({
-        '*currentActivity': Block.activities.SOURCE_SELECT,
+        '*currentActivity': this.cancelActivity,
       });
     },
   };

diff --git a/blocks/SimpleBtn/SimpleBtn.js b/blocks/SimpleBtn/SimpleBtn.js
@@ -18,7 +18,7 @@ export class SimpleBtn extends Block {
         });
       } else {
         this.set$({
-          '*currentActivity': Block.activities.SOURCE_SELECT,
+          '*currentActivity': Block.activities.START_FROM,
         });
       }
     };

diff --git a/blocks/StartFrom/StartFrom.js b/blocks/StartFrom/StartFrom.js
@@ -1,7 +1,12 @@
 import { Block } from '../../abstract/Block.js';
 
 export class StartFrom extends Block {
-  activityType = 'source-select';
+  activityType = 'start-from';
+
+  init$ = {
+    '*activityCaption': '',
+    '*activityIcon': '',
+  };
 
   initCallback() {
     this.registerActivity(this.activityType, () => {

diff --git a/blocks/UploadList/UploadList.js b/blocks/UploadList/UploadList.js
@@ -12,7 +12,7 @@ export class UploadList extends Block {
     hasFiles: false,
     moreBtnDisabled: true,
     onAdd: () => {
-      this.$['*currentActivity'] = Block.activities.SOURCE_SELECT;
+      this.$['*currentActivity'] = Block.activities.START_FROM;
     },
     onUpload: () => {
       this.set$({
@@ -77,6 +77,8 @@ export class UploadList extends Block {
   }
 
   initCallback() {
+    super.initCallback();
+
     this.bindCssData('--cfg-show-empty-list');
 
     this.registerActivity(this.activityType, () => {
@@ -96,7 +98,7 @@ export class UploadList extends Block {
 
     this.sub('*uploadList', (/** @type {String[]} */ list) => {
       if (list && list.length === 0 && !this.$['*--cfg-show-empty-list']) {
-        this.$['*currentActivity'] = Block.activities.SOURCE_SELECT;
+        this.$['*currentActivity'] = Block.activities.START_FROM;
         return;
       }
 

diff --git a/blocks/UrlSource/UrlSource.js b/blocks/UrlSource/UrlSource.js
@@ -14,7 +14,7 @@ export class UrlSource extends Block {
     },
     onCancel: () => {
       this.set$({
-        '*currentActivity': Block.activities.SOURCE_SELECT,
+        '*currentActivity': this.cancelActivity,
       });
     },
     onInput: (e) => {

diff --git a/blocks/themes/uc-basic/config.css b/blocks/themes/uc-basic/config.css
@@ -1,4 +1,6 @@
-.uc-wgt-cfg, .uc-wgt-common, :host {
+.uc-wgt-cfg,
+.uc-wgt-common,
+:host {
   --cfg-multiple: 1;
   --cfg-confirm-upload: 1;
   --cfg-img-only: 0;
@@ -15,11 +17,12 @@
 
   --cfg-modal-scroll-lock: 1;
   --cfg-modal-backdrop-strokes: 1;
-  
+
   --cfg-source-list-wrap: 1;
 
-  --cfg-init-activity: 'source-select';
-  --cfg-done-activity: 'source-select';
+  --cfg-init-activity: 'start-from';
+  --cfg-done-activity: 'start-from';
+  --cfg-cancel-activity: 'start-from';
 
   --cfg-data-output-console: 1;
   --cfg-data-output-fire-events: 1;

diff --git a/solutions/file-uploader/minimal/index.css b/solutions/file-uploader/minimal/index.css
@@ -4,7 +4,8 @@
 :host {
   --cfg-multiple: 0;
   --cfg-confirm-upload: 0;
-  --cfg-init-activity: 'source-select';
+  --cfg-init-activity: 'start-from';
+  --cfg-done-activity: 'upload-list';
 }
 
 uc-start-from {

diff --git a/tsconfig.json b/tsconfig.json
@@ -4,14 +4,7 @@
     "target": "esnext",
     "module": "esnext",
     "moduleResolution": "node",
-    "lib": [
-      "es2017",
-      "ESNext",
-      "ESNext.Array",
-      "DOM",
-      "DOM.Iterable",
-      "WebWorker"
-    ],
+    "lib": ["es2017", "ESNext", "ESNext.Array", "DOM", "DOM.Iterable", "WebWorker"],
     "allowJs": true,
     "checkJs": true,
     "strict": false,