REFA,IMRO: Extended auto-subscriptions of components in compelgroups

src/component.js

@@ -92,9 +92,11 @@ class Component extends StyleAndScriptStoringComponent {
      */
     overflow(vertical = true, horizontal = false) {
         if (vertical) {
+            this.subscribeOnGenerate(CommonCompelGroups.OVERFLOWING);
             this._modifier._modifications["overflow-y"] = "auto";
         }
         if (horizontal) {
+            this.subscribeOnGenerate(CommonCompelGroups.OVERFLOWING);
             this._modifier._modifications["overflow-x"] = "auto";
         }
         return this;
@@ -115,6 +117,8 @@ class Component extends StyleAndScriptStoringComponent {
             (untilFound ? "until-found" : "hidden")
         );
 
+        this.subscribeOnGenerate(CommonCompelGroups.HIDDEN_ON_START);
+
         return this;
     }
 
@@ -123,6 +127,7 @@ class Component extends StyleAndScriptStoringComponent {
      * @returns {Component}
      */
     isHigherComponent() {
+        this.subscribeOnGenerate(CommonCompelGroups.HIGHER_COMPEL);
         this.#isCompel = true;
         return this.setAttribute("data-compel-isHCompel", "true")
     }
@@ -144,11 +149,11 @@ class Component extends StyleAndScriptStoringComponent {
      * @returns {Component}
      */
     registerAsContextMenu() {
+        this.subscribeOnGenerate(CommonCompelGroups.IS_CONTEXT_MENU);
         this._isContextMenu = true;
-        this.addStyleClass('contextmenu')
+        
+        return this.addStyleClass('contextmenu')
             .hidden();
-
-        return this;
     }
 
     /**
@@ -173,6 +178,7 @@ class Component extends StyleAndScriptStoringComponent {
         }
 
         let cMenuWenity = component.generate();
+        this.subscribeOnGenerate(CommonCompelGroups.HAS_CONTEXT_MENU);
 
         let identifier = cMenuWenity.html.getAttribute("data-autocompel");
 
@@ -233,6 +239,8 @@ class Component extends StyleAndScriptStoringComponent {
      * @returns {Component}
      */
     draggable(dndGroup = null) {
+        this.subscribeOnGenerate(CommonCompelGroups.DRAGGABLE);
+        this.subscribeOnGenerate(CommonCompelGroups.HAS_DRAG_EVENT);
         let selector = this._element.getAttribute("data-autocompel");
         Page.registerStyling(".grabbin-cursor", { "cursor": "grab" });
 
@@ -259,6 +267,7 @@ class Component extends StyleAndScriptStoringComponent {
      * @param {Function} action 
      */
     onDrag(dragEvent, action = (e) => { e.preventDefault(); }) {
+        this.subscribeOnGenerate(CommonCompelGroups.HAS_DRAG_EVENT);
         let selector = `comp-el-mech-drag${dragEvent}`;
 
         return this.addEventListener(
@@ -278,6 +287,7 @@ class Component extends StyleAndScriptStoringComponent {
         function dropEventCall(event) {
             return dropEventHandler(event, selector);
         }
+        this.subscribeOnGenerate(CommonCompelGroups.DROP_TARGET);
 
         this.addStyleClass(selector)
             .onDrag(EventDrag.OVER);

src/context.js

@@ -189,4 +189,20 @@ class PageBuilder extends ScriptAndStyleContext {
 
 }
 
+const CommonCompelGroups = Object.freeze({
+    AUTO_REGISTRATED: "auto_registrated",
+    REUSABLE_COMPEL: "reusable",
+    HIGHER_COMPEL: "higher_compel",
+
+    OVERFLOWING: "overflowing",
+    HIDDEN_ON_START: "hidden_on_start",
+
+    IS_CONTEXT_MENU: "contextmenu",
+    HAS_CONTEXT_MENU: "contextmenu",
+
+    DRAGGABLE: "draggable",
+    HAS_DRAG_EVENT: "has_drag",
+    DROP_TARGET: "droptarget",
+
+});
 const Page = new PageBuilder();