@dooboostore/dom-render 1.0.108 → 1.0.110

package/src/components/details/Details.ts

@@ -9,7 +9,6 @@ import { type Subscription } from '@dooboostore/core/message/Subscription';
 import { ValidUtils } from '@dooboostore/core-web/valid/ValidUtils';
 import { EventUtils } from '@dooboostore/core-web/event/EventUtils';
 
-
 export namespace Details {
   export const selector = 'dr-details';
 
@@ -18,15 +17,15 @@ export namespace Details {
     toggle_form_reset?: boolean;
     disableOtherClickClose?: boolean;
     toggle?: (open: boolean) => void;
-  }
+  };
   export type BodyAttribute = {
-    float?: 'bottom-left' | 'bottom-right' | 'top-left' | 'top-right'
-  } & Attribute
+    float?: 'bottom-left' | 'bottom-right' | 'top-left' | 'top-right';
+  } & Attribute;
 
   export type FormAttribute = {
     disabledSubmit?: null;
-    submit?: (event: SubmitEvent, element: HTMLFormElement)=>void;
-  } & BodyAttribute
+    submit?: (event: SubmitEvent, element: HTMLFormElement) => void;
+  } & BodyAttribute;
 
   // @Component({
   //   template: '<summary class="${`${@this@.getAttribute(\'class\')} details-summary-container`}$">#innerHTML#</summary>',
@@ -35,7 +34,7 @@ export namespace Details {
   // })
   export class Summary extends ComponentBase<Attribute> {
     constructor() {
-      super({onlyParentType: [Details]});
+      super({ onlyParentType: [Details] });
     }
   }
 
@@ -46,16 +45,13 @@ export namespace Details {
   export class Body extends ComponentBase<BodyAttribute> {
     private $element?: HTMLDivElement;
     constructor() {
-      super({onlyParentType: [Details]});
+      super({ onlyParentType: [Details] });
     }
   }
 
   export const isBody = (instance: any): instance is Body => {
     return instance instanceof Body;
-  }
-
-
-
+  };
 
   // @Component({
   //   template: '<form class="${`${@this@.getAttribute(\'class\')} details-body-container details-body-${@this@.getAttribute(\'float\')}-container details-form-container`}$" dr-on-init="@this@.$element = $element;" dr-event-submit="@this@.submit($element,$event);">#innerHTML#</form>',
@@ -65,14 +61,14 @@ export namespace Details {
   export class Form extends ComponentBase<FormAttribute> {
     private $element?: HTMLFormElement;
     constructor() {
-      super({onlyParentType: [Details]});
+      super({ onlyParentType: [Details] });
     }
     submit(element: HTMLFormElement, event: SubmitEvent) {
       if (this.hasAttribute('disabledSubmit')) {
         event.preventDefault();
       }
       if (this.hasAttribute('submit')) {
-        this.getAttribute('submit')?.(event,  element);
+        this.getAttribute('submit')?.(event, element);
       }
     }
     reset() {
@@ -81,7 +77,7 @@ export namespace Details {
   }
   export const isForm = (instance: any): instance is Form => {
     return instance instanceof Form;
-  }
+  };
 
   // @Component({
   //   template: template,
@@ -98,8 +94,7 @@ export namespace Details {
       super.onCreateRenderData(data);
     }
 
-    onCreateRender(...param: any[]): void {
-    }
+    onCreateRender(...param: any[]): void {}
 
     toggle(element: HTMLDetailsElement) {
       const toggleAttribute = this.getAttribute('toggle');
@@ -107,8 +102,8 @@ export namespace Details {
         toggleAttribute?.(element.open);
       }
     }
-    onInitRender(param: any, rawSet: RawSet): void {
-      super.onInitRender(param,rawSet);
+    async onInitRender(param: any, rawSet: RawSet) {
+      await super.onInitRender(param, rawSet);
 
       if (ValidUtils.isBrowser() && this.rawSet?.dataSet.config.window) {
         const detailsElement = this.element;
@@ -118,18 +113,18 @@ export namespace Details {
           if (this.getAttribute('disableOtherClickClose')) {
             return;
           }
-          if (detailsElement && !detailsElement?.contains(event?.target as Node)){
+          if (detailsElement && !detailsElement?.contains(event?.target as Node)) {
             detailsElement.open = false;
           }
-        })
+        });
         if (detailsElement) {
           this.toggleSubscription = EventUtils.htmlElementEventObservable(detailsElement, 'toggle').subscribe(it => {
             if (ValidUtils.coreValidUtils.isNotNullUndefined(this.getAttribute('toggle_form_reset'))) {
               this.children?.filter(isForm).forEach(it => {
                 it.reset();
-              })
+              });
             }
-          })
+          });
         }
       }
       // console.log('aaaaaaaaaaaaaaaaaaaaa', rawSet);
@@ -139,7 +134,6 @@ export namespace Details {
       super.onChangeAttrRender(name, value, other);
     }
 
-
     onDestroyRender(...metaData: any[]): void {
       this.toggleSubscription?.unsubscribe();
       this.documentClickSubscription?.unsubscribe();
@@ -151,7 +145,6 @@ export namespace Details {
 
     // changeAttribute(attribute: { className: string } | undefined) {
     // }
-
   }
 }
 
@@ -159,29 +152,32 @@ export default {
   detailsSummary: (config?: DomRenderRunConfig) => {
     return RawSet.createComponentTargetElement({
       name: `${Details.selector}-summary`,
-      template: '<summary class="${`${@this@.getAttribute(\'class\')} details-summary-container`}$">#innerHTML#</summary>',
-      objFactory: (e,o,r2, counstructorParam) => {
-        return DomRender.run({rootObject: new Details.Summary(), config: config});
+      template:
+        '<summary class="${`${@this@.getAttribute(\'class\')} details-summary-container`}$">#innerHTML#</summary>',
+      objFactory: (e, o, r2, counstructorParam) => {
+        return DomRender.run({ rootObject: new Details.Summary(), config: config });
       }
-    })
+    });
   },
   detailsBody: (config?: DomRenderRunConfig) => {
     return RawSet.createComponentTargetElement({
       name: `${Details.selector}-body`,
-      template: '<div class="${`${@this@.getAttribute(\'class\')} details-body-container details-body-${@this@.getAttribute(\'float\')}-container`}$" dr-on-init="@this@.$element = $element;">#innerHTML#</div>',
-      objFactory: (e,o,r2, counstructorParam) => {
-        return DomRender.run({rootObject: new Details.Body(), config: config});
+      template:
+        '<div class="${`${@this@.getAttribute(\'class\')} details-body-container details-body-${@this@.getAttribute(\'float\')}-container`}$" dr-on-init="@this@.$element = $element;">#innerHTML#</div>',
+      objFactory: (e, o, r2, counstructorParam) => {
+        return DomRender.run({ rootObject: new Details.Body(), config: config });
       }
-    })
+    });
   },
   detailsForm: (config?: DomRenderRunConfig) => {
     return RawSet.createComponentTargetElement({
       name: `${Details.selector}-form`,
-      template: '<form class="${`${@this@.getAttribute(\'class\')} details-body-container details-body-${@this@.getAttribute(\'float\')}-container details-form-container`}$" dr-on-init="@this@.$element = $element;" dr-event-submit="@this@.submit($element,$event);">#innerHTML#</form>',
-      objFactory: (e,o,r2, counstructorParam) => {
-        return DomRender.run({rootObject: new Details.Form(), config: config});
+      template:
+        '<form class="${`${@this@.getAttribute(\'class\')} details-body-container details-body-${@this@.getAttribute(\'float\')}-container details-form-container`}$" dr-on-init="@this@.$element = $element;" dr-event-submit="@this@.submit($element,$event);">#innerHTML#</form>',
+      objFactory: (e, o, r2, counstructorParam) => {
+        return DomRender.run({ rootObject: new Details.Form(), config: config });
       }
-    })
+    });
   },
   details: (config?: DomRenderRunConfig) => {
     return RawSet.createComponentTargetElement({
@@ -227,10 +223,11 @@ export default {
             /*margin-bottom: 0px;*/
         }
       `,
-      template: '<details class="${`${@this@.getAttribute(\'class\')} details-container`}$" dr-on-init="@this@.element = $element;" dr-event-toggle="@this@.toggle($element)"> #innerHTML# </details>',
-      objFactory: (e,o,r2, counstructorParam) => {
-        return DomRender.run({rootObject: new Details.Details(...counstructorParam), config: config});
+      template:
+        '<details class="${`${@this@.getAttribute(\'class\')} details-container`}$" dr-on-init="@this@.element = $element;" dr-event-toggle="@this@.toggle($element)"> #innerHTML# </details>',
+      objFactory: (e, o, r2, counstructorParam) => {
+        return DomRender.run({ rootObject: new Details.Details(...counstructorParam), config: config });
       }
-    })
-  },
-}
+    });
+  }
+};

package/src/components/forOf/ForOf.ts

@@ -3,12 +3,11 @@ import { DomRender, DomRenderRunConfig } from '../../DomRender';
 import { RawSet } from '../../rawsets/RawSet';
 import { OtherData } from '../../lifecycle/OnChangeAttrRender';
 
-
 export namespace ForOf {
   export const selector = 'System:ForOf';
   export type Attribute<D> = {
     value: D;
-  }
+  };
 
   // @Component({
   //   template: '<div dr-for-of="@this@.data" dr-option-strip="true">#innerHTML#</div>',
@@ -23,19 +22,17 @@ export namespace ForOf {
         this.value = value;
       }
     }
-
   }
 }
 
-
 export default {
   forOf: (config?: DomRenderRunConfig) => {
     return RawSet.createComponentTargetElement({
       name: ForOf.selector,
       template: '<div dr-for-of="@this@.data" dr-option-strip="true">#innerHTML#</div>',
-      objFactory: (e,o,r2, counstructorParam) => {
-        return DomRender.run({rootObject: new ForOf.ForOf(...counstructorParam), config: config});
+      objFactory: (e, o, r2, counstructorParam) => {
+        return DomRender.run({ rootObject: new ForOf.ForOf(...counstructorParam), config: config });
       }
-    })
-  },
-}
+    });
+  }
+};

package/src/components/if/If.ts

@@ -1,6 +1,6 @@
 import { ComponentBase } from '../ComponentBase';
 import { OtherData } from '../../lifecycle/OnChangeAttrRender';
-import { DomRender, DomRenderRunConfig } from '../../DomRender';
+import { DomRender } from '../../DomRender';
 import { OnInitRender } from '../../lifecycle/OnInitRender';
 import { RawSet } from '../../rawsets/RawSet';
 import { DomRenderConfig } from '../../configs/DomRenderConfig';
@@ -15,12 +15,12 @@ export namespace If {
   // }
   export type Attribute<D> = {
     value?: null | boolean;
-  }
+  };
 
   export class If<D> extends ComponentBase<Attribute<D>> implements OnInitRender {
     private sw: boolean = false;
 
-    onInitRender(param: any, rawSet: RawSet) {
+    async onInitRender(param: any, rawSet: RawSet) {
       super.onInitRender(param, rawSet);
     }
 
@@ -28,7 +28,7 @@ export namespace If {
       super.onChangeAttrRender(name, value, other);
 
       if (this.equalsAttributeName(name, 'value')) {
-        // console.log('------',this,name, value)
+        // console.log('--', value, typeof value);
         this.sw = value;
       }
     }
@@ -41,8 +41,6 @@ export namespace If {
 //   template: '<div dr-if="@this@.sw" dr-option-strip="true">#innerHTML#</div>' });
 export default {
   if: (config?: DomRenderConfig) => {
-
-
     // if (!customElements.get(If.selector)) {
     //   customElements.define(If.selector, class extends HTMLElement {
     //     constructor() {
@@ -54,10 +52,10 @@ export default {
 
     return RawSet.createComponentTargetElement({
       name: If.selector,
-      template: '<div dr-if="@this@.sw" dr-option-strip="true">#innerHTML#</div>',
+      template: '<div dr-if="@this@.sw" >#innerHTML#</div>',
       objFactory: (e, o, r2, counstructorParam) => {
-        return DomRender.run({rootObject: new If.If(...counstructorParam), config: config});
+        return DomRender.run({ rootObject: new If.If(...counstructorParam), config: config });
       }
-    })
-  },
-}
+    });
+  }
+};

package/src/components/input/Input.ts

@@ -11,7 +11,6 @@ import { EventUtils } from '@dooboostore/core-web/event/EventUtils';
 import { debounceTime } from '@dooboostore/core/message/operators/debounceTime';
 import { distinctUntilChanged } from '@dooboostore/core/message/operators/distinctUntilChanged';
 
-
 export namespace Input {
   export const selector = `dr-input`;
   export type Attribute = {
@@ -21,13 +20,10 @@ export namespace Input {
     class?: string;
     debounceTime?: number;
     distinct?: boolean;
-    input?: (value: string, element: Element) => void
-
-  }
+    input?: (value: string, element: Element) => void;
+  };
 
-  export class Base extends ComponentBase<any> {
-
-  }
+  export class Base extends ComponentBase<any> {}
 
   // @Component({
   //   selector: `${selector}`,
@@ -39,16 +35,16 @@ export namespace Input {
     private inputSubscription?: Subscription;
     private resetSubscripton?: Subscription;
 
-    onCreateRender(...param: any[]): void {
-    }
+    onCreateRender(...param: any[]): void {}
 
-
-    onInitRender(param: any, rawSet: RawSet) {
-      super.onInitRender(param, rawSet);
+    async onInitRender(param: any, rawSet: RawSet) {
+      await super.onInitRender(param, rawSet);
       // console.log('dr-input, rawSet', rawSet)
       const inputElement = this.element;
       const debounceTimeAttribute = this.getAttribute('debounceTime');
-      const debounceTimeValue = ValidUtils.isNotNullUndefined(debounceTimeAttribute) ? Number(debounceTimeAttribute) : 0;
+      const debounceTimeValue = ValidUtils.isNotNullUndefined(debounceTimeAttribute)
+        ? Number(debounceTimeAttribute)
+        : 0;
       const distinct = ValidUtils.isNotNullUndefined(this.getAttribute('distinct'));
 
       if (inputElement) {
@@ -87,11 +83,9 @@ export namespace Input {
               // console.log('rrrr?')
               this.getAttribute('input')?.(it, inputElement);
             });
-          })
+          });
         }
       }
-
-
     }
 
     onChangeAttrRender(name: string, value: any, other: OtherData) {
@@ -108,7 +102,6 @@ export namespace Input {
       this.resetSubscripton?.unsubscribe();
       this.inputSubscription?.unsubscribe();
     }
-
   }
 }
 
@@ -116,10 +109,11 @@ export default {
   input: (config?: DomRenderRunConfig) => {
     return RawSet.createComponentTargetElement({
       name: `${Input.selector}`,
-      template: '<Input type="${@this@.getAttribute(\'type\')}$" class="${@this@.getAttribute(\'class\')}$" id="${@this@.getAttribute(\'id\')}$" name="${@this@.getAttribute(\'name\')}$" dr-on-init="@this@.element=$element" >#innerHTML#',
+      template:
+        '<Input type="${@this@.getAttribute(\'type\')}$" class="${@this@.getAttribute(\'class\')}$" id="${@this@.getAttribute(\'id\')}$" name="${@this@.getAttribute(\'name\')}$" dr-on-init="@this@.element=$element" >#innerHTML#',
       objFactory: (e, o, r2, counstructorParam) => {
-        return DomRender.run({rootObject: new Input.Input(...counstructorParam), config: config});
+        return DomRender.run({ rootObject: new Input.Input(...counstructorParam), config: config });
       }
-    })
-  },
-}
+    });
+  }
+};

package/src/components/promise/PromiseSwitch.ts

@@ -3,19 +3,22 @@ import { DomRender, DomRenderRunConfig } from '../../DomRender';
 import { RawSet } from '../../rawsets/RawSet';
 import { OtherData } from '../../lifecycle/OnChangeAttrRender';
 
-
 import { ValidUtils } from '@dooboostore/core/valid/ValidUtils';
-import { Promises  } from '@dooboostore/core/promise/Promises';
+import { Promises } from '@dooboostore/core/promise/Promises';
 import { OnCreateRenderDataParams } from '../../lifecycle/OnCreateRenderData';
 
 export namespace PromiseSwitch {
   export const selector = 'dr-promise-switch';
-  export type ChangeParams<T> = { status: 'pending' } | { status: 'finally' } | { status: 'fulfilled', data: T } | { status: 'rejected', data: any };
+  export type ChangeParams<T> =
+    | { status: 'pending' }
+    | { status: 'finally' }
+    | { status: 'fulfilled'; data: T }
+    | { status: 'rejected'; data: any };
   export type Attribute = {
     // trigger?: boolean;
     data: Promise<any> | (() => Promise<any>);
     change?: <T>(data: ChangeParams<T>) => void;
-  }
+  };
 
   class ChildBase<T = any> extends ComponentBase<T> {
     public hidden = true;
@@ -25,8 +28,7 @@ export namespace PromiseSwitch {
   //   template: '<div dr-if="!@this@.hidden" dr-strip="true">#innerHTML#</div>',
   //   selector: `${selector}.Default`
   // })
-  export class Default extends ChildBase {
-  }
+  export class Default extends ChildBase {}
 
   // @Component({
   //   template: '<div dr-if="!@this@.hidden" dr-strip="true">#innerHTML#</div>',
@@ -72,7 +74,6 @@ export namespace PromiseSwitch {
     }
   }
 
-
   /*
       <dr-promise-switch data="${@this@.pickWorldPromise}$">
         ${@nearThis@.promiseState.status}$
@@ -98,7 +99,7 @@ export namespace PromiseSwitch {
     //
     // }
     private promiseState?: Promises.Result.PromiseState<any, unknown>;
-    private status?: Promises.Result.PromiseState<any, unknown>["status"];
+    private state?: Promises.Result.PromiseState<any, unknown>['status'];
 
     onCreatedThisChild(child: any, data: OnCreateRenderDataParams) {
       super.onCreatedThisChild(child, data);
@@ -110,36 +111,36 @@ export namespace PromiseSwitch {
       const pendings = this.getChildren(Pending);
       const fulfilleds = this.getChildren(Fulfilled);
       const rejecteds = this.getChildren(Rejected);
-      const full = [...fulfilleds, ...rejecteds, ...pendings, ...defaults]
+      const full = [...fulfilleds, ...rejecteds, ...pendings, ...defaults];
       // console.log('----!!!!!!-------', this.promiseState, full)
       if (this.promiseState === undefined) {
-        this.status = undefined;
-        full.filter(it => !it.hidden).forEach(it => it.hidden = true)
-        defaults.filter(it => it.hidden).forEach(it => it.hidden = false);
-        pendings.filter(it => it.getAttribute('defaultView') && it.hidden).forEach(it => it.hidden = false);
+        this.state = undefined;
+        full.filter(it => !it.hidden).forEach(it => (it.hidden = true));
+        defaults.filter(it => it.hidden).forEach(it => (it.hidden = false));
+        pendings.filter(it => it.getAttribute('defaultView') && it.hidden).forEach(it => (it.hidden = false));
       } else if (this.promiseState.status === 'pending') {
-        this.status = 'pending';
-        full.filter(it => !it.hidden).forEach(it => it.hidden = true)
-        pendings.filter(it => it.hidden).forEach(it => it.hidden = false);
+        this.state = 'pending';
+        full.filter(it => !it.hidden).forEach(it => (it.hidden = true));
+        pendings.filter(it => it.hidden).forEach(it => (it.hidden = false));
       } else if (this.promiseState.status === 'fulfilled') {
-        this.status = 'fulfilled';
+        this.state = 'fulfilled';
         const value = this.promiseState.value;
         // console.log('-----------fulfilled promises', value);
-        full.filter(it => !it.hidden).forEach(it => it.hidden = true)
+        full.filter(it => !it.hidden).forEach(it => (it.hidden = true));
         fulfilleds.forEach(it => {
-          it.setData(value)
-        })
-        fulfilleds.filter(it => it.hidden).forEach(it => it.hidden = false);
+          it.setData(value);
+        });
+        fulfilleds.filter(it => it.hidden).forEach(it => (it.hidden = false));
       } else if (this.promiseState.status === 'rejected') {
-        this.status = 'rejected';
+        this.state = 'rejected';
         const value = this.promiseState.reason;
-        full.filter(it => !it.hidden).forEach(it => it.hidden = true)
+        full.filter(it => !it.hidden).forEach(it => (it.hidden = true));
         rejecteds.forEach(it => {
-          it.setData(value)
-        })
-        rejecteds.filter(it => it.hidden).forEach(it => it.hidden = false);
+          it.setData(value);
+        });
+        rejecteds.filter(it => it.hidden).forEach(it => (it.hidden = false));
       }
-      return this.status;
+      return this.state;
       // console.log('----!!!!!!-end------', this.promiseState, full.map(it=>it.hidden))
     }
 
@@ -149,31 +150,33 @@ export namespace PromiseSwitch {
       if (this.equalsAttributeName(name, 'data') && value) {
         // this.childStateChange();
         this.promiseState = undefined;
-        this.status = undefined;
-        this.promiseState = Promises.Result.wrap(typeof value === 'function' ? value() : value as Promise<any>);
-        this.getAttribute('change')?.({status: 'pending'});
+        this.state = undefined;
+        this.promiseState = Promises.Result.wrap(typeof value === 'function' ? value() : (value as Promise<any>));
+        this.getAttribute('change')?.({ status: 'pending' });
         this.childStateChange();
         // console.log('----?', this.promiseState)
-        this.promiseState.then(data => {
-          // console.log('------------then', data);
-          this.childStateChange();
-          this.getAttribute('change')?.({status: 'fulfilled', data: data});
-          return data;
-        }).catch((e) => {
-          // console.log('catch', e)
-          this.childStateChange();
-          this.getAttribute('change')?.({status: 'rejected', data: e});
-          throw e;
-        }).finally(() => {
-          // console.log('-------------finally--------rrrrrrrrrrr', this.promiseState)
-          // this.childStateChange();
-          this.getAttribute('change')?.({status: 'finally'});
-        })
+        this.promiseState
+          .then(data => {
+            // console.log('------------then', data);
+            this.childStateChange();
+            this.getAttribute('change')?.({ status: 'fulfilled', data: data });
+            return data;
+          })
+          .catch(e => {
+            // console.log('catch', e)
+            this.childStateChange();
+            this.getAttribute('change')?.({ status: 'rejected', data: e });
+            throw e;
+          })
+          .finally(() => {
+            // console.log('-------------finally--------rrrrrrrrrrr', this.promiseState)
+            // this.childStateChange();
+            this.getAttribute('change')?.({ status: 'finally' });
+          });
         // await this.promiseState;
 
-
         // console.log('---------------------rrrrrrrrrrr', this.promiseState)
-      } else if(this.equalsAttributeName(name, 'data') && ValidUtils.isNullOrUndefined(value)) {
+      } else if (this.equalsAttributeName(name, 'data') && ValidUtils.isNullOrUndefined(value)) {
         this.promiseState = undefined;
         this.childStateChange();
       }
@@ -181,52 +184,50 @@ export namespace PromiseSwitch {
   }
 }
 
-
 export default {
   promiseDefault: (config?: DomRenderRunConfig) => {
     return RawSet.createComponentTargetElement({
       name: `${PromiseSwitch.selector}-default`,
       template: '<div dr-if="!@this@.hidden" dr-option-strip="true">#innerHTML#</div>',
-      objFactory: (e,o,r2, counstructorParam) => {
-        return DomRender.run({rootObject: new PromiseSwitch.Default(...counstructorParam), config: config});
+      objFactory: (e, o, r2, counstructorParam) => {
+        return DomRender.run({ rootObject: new PromiseSwitch.Default(...counstructorParam), config: config });
       }
-    })
+    });
   },
   promisePending: (config?: DomRenderRunConfig) => {
     return RawSet.createComponentTargetElement({
       name: `${PromiseSwitch.selector}-pending`,
       template: '<div dr-if="!@this@.hidden" dr-option-strip="true">#innerHTML#</div>',
-      objFactory: (e,o,r2, counstructorParam) => {
-        return DomRender.run({rootObject: new PromiseSwitch.Pending(...counstructorParam), config: config});
+      objFactory: (e, o, r2, counstructorParam) => {
+        return DomRender.run({ rootObject: new PromiseSwitch.Pending(...counstructorParam), config: config });
       }
-    })
+    });
   },
   promiseFulfilled: (config?: DomRenderRunConfig) => {
     return RawSet.createComponentTargetElement({
       name: `${PromiseSwitch.selector}-fulfilled`,
       template: '<div dr-if="!@this@.hidden" dr-option-strip="true">#innerHTML#</div>',
-      objFactory: (e,o,r2, counstructorParam) => {
-        return DomRender.run({rootObject: new PromiseSwitch.Fulfilled(...counstructorParam), config: config});
+      objFactory: (e, o, r2, counstructorParam) => {
+        return DomRender.run({ rootObject: new PromiseSwitch.Fulfilled(...counstructorParam), config: config });
       }
-    })
+    });
   },
   promiseRejected: (config?: DomRenderRunConfig) => {
     return RawSet.createComponentTargetElement({
       name: `${PromiseSwitch.selector}-rejected`,
       template: '<div dr-if="!@this@.hidden" dr-option-strip="true">#innerHTML#</div>',
-      objFactory: (e,o,r2, counstructorParam) => {
-        return DomRender.run({rootObject: new PromiseSwitch.Rejected(...counstructorParam), config: config});
+      objFactory: (e, o, r2, counstructorParam) => {
+        return DomRender.run({ rootObject: new PromiseSwitch.Rejected(...counstructorParam), config: config });
       }
-    })
+    });
   },
   promiseSwitch: (config?: DomRenderRunConfig) => {
     return RawSet.createComponentTargetElement({
       name: `${PromiseSwitch.selector}`,
       template: '#innerHTML#',
-      objFactory: (e,o,r2, counstructorParam) => {
-        return DomRender.run({rootObject: new PromiseSwitch.PromiseSwitch(...counstructorParam), config: config});
+      objFactory: (e, o, r2, counstructorParam) => {
+        return DomRender.run({ rootObject: new PromiseSwitch.PromiseSwitch(...counstructorParam), config: config });
       }
-    })
-  },
-
-}
+    });
+  }
+};